table.columns不是datatable.js中的函数

Question

<script>

    jQuery(document).ready(function () {


        $('#sample_3 tfoot th').each(function () {

            var title = $('#sample_3 thead th').eq($(this).index()).text();

            $(this).html('<input type="text" placeholder="Search ' + title + '" />');
        });

        // DataTable
        var table = $('#sample_3').dataTable();

        // Apply the filter
        table.columns().eq(0).each(function (colIdx) {

            $('input', table.column(colIdx).footer()).on('keyup change', function () {

                table
                    .column(colIdx)
                    .search(this.value)
                    .draw();
            });
        });

    });
</script>

我得到table.columns不是函数js错误,缺少什么我不明白.

来源:https://datatables.net/examples/api/multi_filter.html

Answer 1

尝试改变

var table = $('#sample_3').dataTable();

至

var table = $('#sample_3').DataTable();

......就是把资本化DataTable().资料来源:https://datatables.net/manual/api#Accessing-the-API

Answer 2

更改:

table.columns()

至:

table.api().columns()

它对我有用.

Answer 3

我正在尝试使用dataTables的makeEditable()函数.如果我用DataTables()更改dataTables(),它就不起作用.

h0mayun的答案对我有用.以防万一其他人搜索这个问题我在h0mayun的评论中添加了一些东西.

var table = $('#sample_3').dataTable();
$('#sample_3 tfoot th').each(function (i) 
{

            var title = $('#sample_3 thead th').eq($(this).index()).text();
            // or just var title = $('#sample_3 thead th').text();
            var serach = '<input type="text" placeholder="Search ' + title + '" />';
            $(this).html('');
            $(serach).appendTo(this).keyup(function(){table.fnFilter($(this).val(),i)})
});

并删除以下部分

// Apply the filter
        table.columns().eq(0).each(function (colIdx) {

            $('input', table.column(colIdx).footer()).on('keyup change', function () {

                table
                    .column(colIdx)
                    .search(this.value)
                    .draw();
            });
        });

希望它能帮助别人.