使用选择框进行数据表单列搜索

时间:2014-09-18 11:46:29

标签: javascript jquery drop-down-menu datatable

我可以使用数据表中的选择框进行单独搜索,但我只想为一列创建此内容,其他列是不必要的。例如,我只想在第二列和第三列激活此选择框事件。

我找到了this URL,但它对我没有帮助。这是我的JavaScript代码:

$(document).ready(function() {
    var table = $('#example').DataTable();

    $("#example tfoot th").each( function ( i ) {
        var select = $('<select><option value="">Lütfen seçiniz</option></select>')
            .appendTo( $(this).empty() )
            .on( 'change', function () {
                var val = $(this).val();

                table.column( i )
                    .search( val ? '^'+$(this).val()+'$' : val, true, false )
                    .draw();
            } );

        table.column( i ).data().unique().sort().each( function ( d, j ) {
            select.append( '<option value="'+d+'">'+d+'</option>' )
        } );
    } );
} );

1 个答案:

答案 0 :(得分:2)

有没有办法解决。

您可以执行以下操作:

$(document).ready(function() {

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

    $("#example tfoot th").each( function ( i ) {

    if(i == 0){ //Create just one SelectBox
            var select = $('<select class='+i+'><option value=""></option></select>')
                .appendTo( $(this).empty() )
                .on( 'change', function () {

                    var val = $(this).val();

                    table.column( 0 ) //Only the first column
                        .search( val ? '^'+$(this).val()+'$' : val, true, false )
                        .draw();
                } );

            table.column( 0 ).data().unique().sort().each( function ( d, j ) {
                select.append( '<option value="'+d+'">'+d+'</option>' );
            } );
    } 
});
} );