jQuery Datatables搜索文本框

时间:2017-04-14 15:48:43

标签: jquery asp.net-mvc datatables

为什么我的搜索文本框不会初始化为空?我试过了:

table.state.clear();

我尝试过:

"bStateSave": false, // save datatable state(pagination, sort, etc) in cookie.

使用过滤器后,重定向到另一个视图,创建一个新搜索,然后返回到我的搜索结果,文本框始终包含我用于过滤器的最后一个字符串。

我正在使用MVC5作为我的框架。

enter image description here

enter image description here

var initTable4 = function () {

    var table = $('#sample_4');
    table.dataTable({

        "language": {
            "aria": {
                "sortAscending": ": activate to sort column ascending",
                "sortDescending": ": activate to sort column descending"
            },
            "emptyTable": "No data available in table",
            "info": "Showing _START_ to _END_ of _TOTAL_ records",
            "infoEmpty": "No records found",
            "infoFiltered": "(filtered1 from _MAX_ total records)",
            "lengthMenu": "Show _MENU_",
            "search": "Search:",
            "zeroRecords": "No matching records found",
            "paginate": {
                "previous":"Prev",
                "next": "Next",
                "last": "Last",
                "first": "First"
            }
        },            

        "bStateSave": false, // save datatable state(pagination, sort, etc) in cookie.

        "lengthMenu": [
            [6, 15, 20, -1],
            [6, 15, 20, "All"] // change per page values here
        ],
        // set the initial value
        "pageLength": 6,
        "columnDefs": [{  // set default column settings
            'orderable': false,
            'targets': [0]
        }, {
            "searchable": false,
            "targets": [0]
        }],
        "order": [
            [1, "asc"]
        ] // set first column as a default sort by asc
    });

    var tableWrapper = jQuery('#sample_4_wrapper');

    table.find('.group-checkable').change(function () {
        var set = jQuery(this).attr("data-set");
        var checked = jQuery(this).is(":checked");
        jQuery(set).each(function () {
            if (checked) {
                $(this).prop("checked", true);
            } else {
                $(this).prop("checked", false);
            }
        });
    });
}

2 个答案:

答案 0 :(得分:0)

我相信table.search('').draw()会清除特定搜索框的价值,但仍会保留您可能拥有的任何现有列搜索者。

我在搜索字段的[x]清除框中实现了它,如下所示。

$(document).on('input', '.clearable',
function () {
    $(this)[tog(this.value)]('x');
}).on('mousemove', '.x', function (e) {

    $(this)[tog(
    this.offsetWidth - 18 < e.clientX - this.getBoundingClientRect().left)]('onX');
}).on('click', '.onX', function () {
    $(this).removeClass('x onX').val('');
    table.search('').draw();
});

答案 1 :(得分:0)

 $('#sample_4').dataTable({ 
    responsive : true,
    search : {
               search : '' //set search field as empty
             }
})