从外部输入 MVC jquery 数据表搜索

Posted 2023-03-10

【中文标题】从外部输入 MVC jquery 数据表搜索

【英文标题】：MVC jquery datatable search from external input

【发布时间】：2017-03-30 14:38:11

【问题描述】：

我正在尝试设置外部输入来搜索 jquery 数据表。请看我的查看代码：

<link href="~/Content/DataTables/css/jquery.dataTables.min.css" rel="stylesheet"/>
<link href="~/Content/DataTables/css/select.bootstrap.css" rel="stylesheet"/>

<script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script>
<script src="~/Scripts/DataTables/dataTables.select.min.js"></script>
<script type="text/javascript">
    $(document)
    .ready(function() 
        var sfTable = $('#sfTable')
            .dataTable(
                "ajax": 
                    "url": "/Search/LoadData",
                    "type": "GET",
                    "datatype": "json"
                ,
                "columns": [
                     "data": "Id", "autoWidth": true ,
                     "data": "Name", "autoWidth": true ,
                     "data": "Address", "autoWidth": true 
                ],
                "searching": true,
                "select": true
            );

        $('#searchMe')
            .on('keyup',
                function() 
                    sfTable.search(this.value).draw();
                );
    );
</script>
<input id="searchMe" type="text"/>
<table id="sfTable" class="table table-condensed">
<thead>
<tr>
    <th>ID</th>
    <th>Name</th>
    <th>Address</th>
</tr>
</thead>
</table>

如果我在呈现的数据表中使用默认搜索，它可以正常工作，但使用我的自定义 SearchMe 控件不会搜索表。我的最终目标是从单个输入中搜索两个数据表。

【问题讨论】：

这里有！ link

【参考方案1】：

Datatables - Search Box outside datatable

这让我找到了答案，而且非常简单——var sfTable = $('#sfTable').dataTable( 代码必须是 DataTable() 上的大写 D——突然就可以了！