DataTable中的单个列搜索不起作用

时间:2016-06-29 15:27:23

标签: html search datatables multiple-columns

我有一个表,我试图使用jQuery DataTables实现单独的列搜索。描述如何执行此操作的API在此处:https://datatables.net/examples/api/multi_filter.html这是我在尝试实现此操作时使用的。我还使用全局搜索功能,它允许我搜索所有表格。据我所知,冲突发生在使用

之间
            var table = $(".datatable").dataTable();

            var table = $(".datatable").DataTable();

因为它们会返回两个不同的东西(在下面给出相关问题的答案中对此进行了描述 - > dataTable() vs. DataTable() - why is there a difference and how do I make them work together?阅读完之后,我尝试使用这样的解决方案:

table.api().columns().eq(0).each(function(colIdx) {

但遗憾的是,这并没有使这项功能发挥作用。该表与每列底部的搜索框一起显示正常,全局搜索完美无缺。如果你能发现我可能做错的事情或给出任何建议,我将不胜感激。完整的脚本如下:

        script.
        $(document).ready(function() {
            $('.datatable').DataTable({

            });


            // THIS IS THE GLOBAL SEARCH CODE
            $.fn.dataTableExt.oApi.fnFilterAll=function(oSettings,sInput,iColumn,bRegex,bSmart){
                var settings = $.fn.dataTableSettings;
                for (var i = 0; i < settings.length; i++) {
                    settings[i].oInstance.fnFilter(sInput, iColumn, bRegex, bSmart);
                }
            };

            var table = $(".datatable").dataTable();


            $("#Search_All").keyup(function () {
                // Filter on the column (the index) of this element
                table.fnFilterAll(this.value);
            });


            // THIS IS THE INDIVIDUAL COLUMN SEARCH
            $('.datatable tfoot th').each(function () {
                var title = $(this).text();
                $(this).html('<input type="text" placeholder="Search ' + title + '" />');
            });


            table.api().columns().eq(0).each(function(colIdx) {
                var that = this;
                $('input', this.footer()).on('keyup change', function(){
                    if (that.search() !== this.value) {
                        that
                            .search(this.value)
                            .draw();
                    }
                })
            });
        });

谢谢你的时间!

0 个答案:

没有答案