Question

我有一个包含逐列搜索的数据表以及默认搜索。我已经应用columnDefs将列识别为数字格式，但它不适用于列搜索，只适用于默认值。如何按列搜索输入包含这些columDefs？

我的数据表代码：

    j$ = jQuery.noConflict();

    // Data Tables code
    j$(document).ready(function(){

        // Setup - add a text input to each footer cell
        j$('#myTable tfoot th').each( function () {
            var title = j$(this).text();
            j$(this).html( '<input type="text" placeholder="Search '+title+'" />' );
        } );

        var dtResults = recordBuild();
        console.log(dtResults);
        var table = j$('#myTable').DataTable( {
            pageLength: 10,
            scrollX: true,
            data: dtResults,
            columns: [
                {data: 'Renewal_Name',
                defaultContent: ''},
                {data: 'Renewal_Status__c',
                defaultContent: ''},
                {data: 'Renewal_Manufacturer_Name',
                defaultContent: ''},
                {data: 'Master_Vendor__c',
                defaultContent: ''},
                {...}
            ],

            columnDefs: [
                {type: 'num-fmt', targets: [10,17]}
            ],

            buttons: [
                'excelHtml5'
            ],

            dom: 'Bfrtip',

            initComplete: function(settings, json) {
                j$('div.loading').remove();
            }
        });

        // Apply the filter
        table.columns().every( function () {
            var column = this;

            j$( 'input', this.footer() ).on( 'keyup change', function () {
                column
                    .search( this.value )
                    .draw();
            });
        });

根据数据表网站上的示例，我已将数据表初始化与“设置”相关联。和＆＃39;申请＆＃39;部分。

我确认使用默认搜索时columnDefs按预期工作。有没有办法将columnDefs应用于此处创建的输入？

Answer 1

试试这个......

// Setup - add a text input to each footer cell
j$('#myTable tfoot th').each( function () {
    var title = j$(this).text();
    j$(this).html( '<input type="text" class="myCustomSearch" placeholder="Search '+title+'" />' );     // Added a class here
} );

然后添加：

$(".myCustomSearch").on("keyup",function(){
    $("#[*YOUR TABLE ID*]_filter").find("input").val( $(this).val() );
});

它将＆＃34;转发＆＃34;键盘输入到数据表搜索字段如果您不希望用户看到这个＆＃34;复制效果＆＃34;，请将#[*YOUR TABLE ID*]_filter设置为display:none。

这当然......将搜索整个表格......不仅仅是一个特定的专栏。 ;）

数据表：columnDefs不适用于列搜索

1 个答案: