数据表在搜索时不刷新表

时间:2018-01-08 11:31:23

标签: javascript jquery datatable datatables

我正在使用Datatables中的.search()方法。目前,当用户点击已定义的按钮时,我正在使用它来查找第0行中的值。但是,当用户点击此按钮并且他想再返回以查看所有表条目(删除搜索框中的输入文本)时,Datatables不会绘制所有条目。这是我的代码:

regExSearch ='^'+event+'$';

// Place the value into the datatable input filter and set focus there.
var tableInput = $('#tableID_filter > label > input').get(0);
$(tableInput).val(event);
$(tableInput).focus();

// Apply the match case (with regex) search manually.
var table = getDatatableInstance('#tableID');
table.column(0).search( regExSearch, true, false ).draw();

数据表代码:

function fullTableComplete(div, dataSet, columns, orientation, columnsToHide, columnsToExport, sort, pageLength) {

// This function allows you to choose the orientation of the pdf export,
// the columns that must to be hidden and the columns that have not to be 
// exported
$(div).dataTable( {
    "responsive": true,
    "data": dataSet,
    "lengthMenu": [[5, 10, 50, 100, -1], ['5', '10', '50', '100', gettext('All')]],
    "bSort": sortable,
    "order": [[ 0, "asc" ]],
    "pageLength": pageLength,
    "columns": columns,
    "columnDefs": [
        {
            "targets": columnsToHide,
            "visible": false,
            "searchable": false
        }
    ],
    "buttons": [
        {
            "extend": 'csv',
            "name" : 'csv',
            "exportOptions": {
                "columns": columnsToExport
            }
        },
        {
            "extend": 'pdf',
            "name" : 'pdf',
            "exportOptions": {
                "columns":  columnsToExport
            },
            "orientation": orientation
        }
    ]
});

$('.buttons-csv').html('<i class="fa fa-file-excel-o"></i> CSV');
$('.buttons-pdf').html('<i class="fa fa-file-pdf-o"></i> PDF');

}

其余的Datatables正确响应,所以我不知道为什么当用户从输入框中删除搜索文本时,datatable不会再次绘制所有条目。

为避免出现问题,我在输入框中编写要搜索的文本,以更加图形化和直观地对网页进行搜索。

有人可以帮助我吗?

先谢谢你,问候

麦克

1 个答案:

答案 0 :(得分:0)

您可以通过DataTables API清除过滤器以搜索空字符串:

$('#myTable').dataTable().fnFilter('');