0
我面临jQuery数据表的问题。我有一个包含3个数据表的页面，所有这些页面都通过ajax调用获取数据并正确地传递数据。排序和分页也很完美。只有过滤不是很好。一旦我在第一个表的搜索字段中输入值，我就得到了过滤的最后一个表，而不是第一个表。jQuery Datatables - 在过滤的单个页面上的多个表
我也试过这样：https://datatables.net/examples/basic_init/multiple_tables.html ，但它并没有帮助
我的网站是MVC 5 C＃。我在这里读了很多类似的问题，但我找不到任何适合我的答案。 这是我的代码：
<div class="col-md-12">
<div class="card">
<h3 class="card-title">Table 1</h3>
<div class="card-body">
<table class="table table-hover table-bordered" id="tableLow1">
<thead>
<tr>
<th>Col1</th>
<th>Col2</th>
<th>Col23</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
<div class="col-md-12">
<div class="card">
<h3 class="card-title">Table 2</h3>
<div class="card-body">
<table class="table table-hover table-bordered" id="tableLow2">
<thead>
<tr>
<th>Col1</th>
<th>Col2</th>
<th>Col23</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
，这是我在这里的jQuery代码：
function SetupTable1() {
var tableLow1 = $('#tableLow1').DataTable({
destroy: true,
"language": {
"url": "../Scripts/localization/datatables.de.json",
searchPlaceholder: "ID# Eingeben..."
},
"initComplete": function (settings, json) {
// filter only after RETURN or filter is deleted
$(".dataTables_filter input")
.unbind()
.bind('keyup change', function (e) {
if (e.keyCode == 13 || this.value == "") {
tableLow1
.search(this.value)
.draw();
}
});
},
"autoWidth": false,
"autoHeight": true,
"processing": true,
"serverSide": true,
"ajax": {
"url": "/Home/GetDataTable1",
"type": "POST"
},
scrollX: true,
scrollY: true,
scrollCollapse: true,
"fixedColumns": {
leftColumns: 1
},
"order": [[1, "desc"]],
"columnDefs": [
{
"targets": 0,
"data": null,
render: function (data, type, row) {
return "<span class='smart_modal btn btn-primary'> Accept </span>"
}
},
{
"targets": [0],
"orderable": false
},
{
"targets": [1],
"orderable": true
},
{
"targets": [2],
"orderable": false
},
{
"targets": [3],
"orderable": false
}
],
"columns": [
{ "data": null },
{ "data": "value1" },
{ "data": "value2" },
{ "data": "value3" }
]
});
};
function SetupTable2() {
var tableLow2 = $('#tableLow2').DataTable({
destroy: true,
"language": {
"url": "../Scripts/localization/datatables.de.json",
searchPlaceholder: "ID# Eingeben..."
},
"initComplete": function (settings, json) {
// filter only after RETURN or filter is deleted
$(".dataTables_filter input")
.unbind()
.bind('keyup change', function (e) {
if (e.keyCode == 13 || this.value == "") {
tableLow2
.search(this.value)
.draw();
}
});
},
"autoWidth": false,
"autoHeight": true,
"processing": true,
"serverSide": true,
"ajax": {
"url": "/Home/GetDataTable2",
"type": "POST"
},
scrollX: true,
scrollY: true,
scrollCollapse: true,
"fixedColumns": {
leftColumns: 1
},
"order": [[1, "desc"]],
"columnDefs": [
{
"targets": 0,
"data": null,
render: function (data, type, row) {
return "<span class='smart_modal btn btn-primary'> Accept </span>"
}
},
{
"targets": [0],
"orderable": false
},
{
"targets": [1],
"orderable": true
},
{
"targets": [2],
"orderable": false
},
{
"targets": [3],
"orderable": false
}
],
"columns": [
{ "data": null },
{ "data": "value1" },
{ "data": "value2" },
{ "data": "value3" }
]
});
};
显示您的代码，我们将检查并让您知道您的问题。 –
所以我更新了我的问题与要求代码 –
@AlivetoDie，我即时调用函数，但我没有添加代码行在这里。仔细阅读我的问题，表格呈现正确，数据ID正确显示，唯一的问题是过滤。这也与lang包路径无关，也是正确的。 –