我有一个DataTable,我试图通过它和ajax调用加载数据,但第一行数据总是这样写的:
“表中没有可用的数据”
但是在它下面包含了加载的ajax数据。如何删除No data行并将ajax数据加载到该位置?
代码如下:
<div class="box-body">
<table id="changeTicketsTable" class="table table-bordered table-striped">
<thead>
<tr>
<th>Ticket Number</th>
<th>Description</th>
<th>Risk</th>
<th>Primary CI</th>
<th>State</th>
<th>Planned Start Date</th>
<th>Actual Start Date</th>
<th>Actual End Date</th>
<th>Affected Partners</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th>Ticket Number</th>
<th>Description</th>
<th>Risk</th>
<th>Primary CI</th>
<th>State</th>
<th>Planned Start Date</th>
<th>Actual Start Date</th>
<th>Actual End Date</th>
<th>Affected Partners</th>
</tr>
</tfoot>
</table>
</div>
DataTable的实现:
<script>
getChangeTicketInformation();
$('#changeTicketsTable').DataTable({
"pageLength": 5,
'paging' : true,
'lengthChange': true,
'searching' : false,
'ordering' : true,
'info' : true,
'autoWidth' : false
});
})
</script>
用于进行Ajax调用的Javascript:
function getChangeTicketInformation(){
$.ajax({
type: "GET",
url: "../../get_change_ticket_info",
success: function(data) {
$.each(data, function (i, item) {
$('#changeTicketsTable').find('tbody').append(
'<tr>' +
'<td>' + item.number + '</td>' +
'<td>' + item.short_description + '</td>' +
'<td>' + item.risk + '</td>' +
'<td>' + item.cmdb_ci_display_value + '</td>' +
'<td>' + item.state + '</td>' +
'<td>' + item.start_date + '</td>' +
'<td>' + item.work_start + '</td>' +
'<td>' + item.work_end + '</td>' +
'<td>' + 'FILL IN' + '</td>'
+ '</tr>');
});
}
});
}
发布于 2019-06-04 01:19:23
在Chrome中打开开发人员工具,在页面中输入jquery (也在下面),看看会发生什么。然后检查html并查看是否按预期进行了更新-它可能在那里,但可能被隐藏。
但实际上更好的方法是使用数据表的内置ajax功能:https://datatables.net/examples/ajax/simple.html
$('#changeTicketsTable').find('tbody').append(
'<tr>' +
'<td>' + item.number + '</td>' +
'<td>' + item.short_description + '</td>' +
'<td>' + item.risk + '</td>' +
'<td>' + item.cmdb_ci_display_value + '</td>' +
'<td>' + item.state + '</td>' +
'<td>' + item.start_date + '</td>' +
'<td>' + item.work_start + '</td>' +
'<td>' + item.work_end + '</td>' +
'<td>' + 'FILL IN' + '</td>'
+ '</tr>');
});
https://stackoverflow.com/questions/56431796
复制相似问题