Question

我在一个网站（asp.net）工作，我正在使用一个包含数据表的模板，这是该表的初始化代码：

 if ($('body').data('page') == 'products') {


    var opt = {};

     // Tools: export to Excel, CSV, PDF & Print
    opt.sDom = "<'row m-t-10'<'col-md-6'f><'col-md-6'T>r>t<'row'<'col-md-6'><'col-md-6 align-right'p>>",
    opt.oLanguage = { "sSearch": "" } ,
    opt.iDisplayLength = 15,

    opt.oTableTools = {
        "sSwfPath": "assets/plugins/datatables/swf/copy_csv_xls_pdf.swf",
        "aButtons": ["csv", "xls", "pdf", "print"]
    };
    opt.aoColumnDefs = [
          { 'bSortable': false, 'aTargets': [6, 7, 8, 9] }

       ];



    var oTable = $('#products-table').dataTable(opt);

    oTable.fnDraw();



    /* Add a placeholder to searh input */
    $('.dataTables_filter input').attr("placeholder", "Search a product...");

    /* Delete a product */
    $('#products-table a.delete').on('click', function (e) {
        e.preventDefault();
        if (confirm("Are you sure to delete this product ?") == false) {
            return;
        }
        var nRow = $(this).parents('tr')[0];
        oTable.fnDeleteRow(nRow);
        // alert("Deleted! Do not forget to do some ajax to sync with backend :)");
    });

}

我想为特定列添加过滤器类型select（下拉框）。有什么帮助吗？

Answer 1

根据您使用的dataTable版本，有不同的推荐方法。假设你有<select>这样：

<select id="filter">
    <option value="firefox">firefox</option>
    <option value="mozilla">mozilla</option>
</select>

dataTables 1.10.x （使用DataTable()构造函数）：

$("#filter").on('change', function() {
    //filter by selected value on second column
    table.column(1).search($(this).val()).draw();
});

参见演示 - ＆gt;的 http://jsfiddle.net/qxc26rmd/

dataTables 1.9.x （使用dataTable()构造函数）：

$("#filter").on('change', function() { //filter by selected value on second column table.fnFilter($(this).val(), 1); });

参见演示 - ＆gt;的 http://jsfiddle.net/92ttv3o4/

通过下拉列表选择项目筛选的数据表

1 个答案: