【问题标题】:Remove search filter on Datatable删除数据表上的搜索过滤器
【发布时间】:2015-02-08 17:14:29
【问题描述】:

我在我的 DataTable 中应用了一个按钮,单击该按钮会过滤数据表,以仅显示单击的行。

表初始化是:

       var oDatatable = $("#tblDataTable").DataTable({
            dom: '<"top"CRTl><"clear">rt<"bottom"ip><"clear">',
            columns: [
                                   { data: 'Message' },
                { data: 'MessageId' },
                { data: null, "defaultContent": "<button id=\"tblRowData\">Click</button>"}
            ],

            "columnDefs": [
             { "visible": false, "targets": 0 }
            ]
           });

而我的点击事件是:

    $('#tblDataTable tbody').on('click', 'button', function (event) {
    var data = oDataTable.row($(this).parents('tr')).data();
    oDataTable
     .columns(8)
     .search(data['MessageId'])
     .draw();

这一切都很好,但现在我想在页面上执行任何其他操作时重置过滤器。例如,更改日期时间选择器。

如何检查数据表是否应用了 seach 过滤器并将其删除(即在点击事件之前重置表)。

【问题讨论】:

    标签: datatables jquery-datatables datatables-1.10


    【解决方案1】:

    也许你正在看这样的东西:http://www.datatables.net/plug-ins/api/fnFilterClear
    您可以通过非常简单的方式清除搜索:

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

    【讨论】:

      【解决方案2】:

      更简单

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

      【讨论】:

        【解决方案3】:

        如果您要检查是否应用了现有的搜索过滤器,然后只清除特定的过滤器,您可以这样做:

            var table = $('#example').DataTable();
        
            // The index of the column being searched
            var colIdx = 3;
        
            // Retrieve the current stored state of the table
            var tableState = table.state.loaded();
        
            // Retrieve the stored search value of the column
            var filterForColIdx = tableState.columns[colIdx].search.search;
        
            if ( '' !== filterForColIdx ) {
              // Clear the search term and re-draw
              table
               .columns( colIdx )
               .search( '' )
               .draw();
            }
        

        注意:我在 Datatable 上使用 'stateSave': true 选项来保持页面请求之间的状态。

        【讨论】:

          猜你喜欢
          • 2020-05-16
          • 2012-11-01
          • 2023-01-07
          • 1970-01-01
          • 2014-02-03
          • 2010-10-07
          • 2021-09-18
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多