我正在尝试使用行详细信息填充DataTable,但没有任何工作。它显示很好,但它不会填充表格。 我的javascript代码:
<script>
/* Formatting function for row details - modify as you need */
function format ( d ) {
// `d` is the original data object for the row
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
'<tr>'+
'<td>Full name:</td>'+
'<td>'+d.firstName+'</td>'+
'</tr>'+
'<tr>'+
'<td>Full name:</td>'+
'<td>'+d.middleName+'</td>'+
'</tr>'+
'<tr>'+
'<td>Full name:</td>'+
'<td>'+d.lastName+'</td>'+
'</tr>'+
'<tr>'+
'<td>Extension number:</td>'+
'<td>'+d.comapnyName+'</td>'+
'</tr>'+
'<tr>'+
'<td>Extension number:</td>'+
'<td>'+d.number+'</td>'+
'</tr>'+
'<tr>'+
'<td>Extra info:</td>'+
'<td>And any further details here (images etc)...</td>'+
'</tr>'+
'</table>';
}
$(document).ready(function() {
var table = $('#clients_table').DataTable( {
"ajax": "clientDetails.txt",
"columns": [
{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
},
{ "data": "firstName" },
{ "data": "middleName" },
{ "data": "lastName" },
{ "data": "companyName" },
{ "data": "number" }
],
"order": [[1, 'asc']]
} );
// Add event listener for opening and closing details
$('#clients_table tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest('tr');
var row = table.row( tr );
if ( row.child.isShown() ) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
}
else {
// Open this row
row.child( format(row.data()) ).show();
tr.addClass('shown');
}
} );
} );
这个我的html代码基本上只是一个表
<div id="table">
<table id="clients_table" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Middle Name</th>
<th>Surname</th>
<th>Company</th>
<th>Telephone</th>
</tr>
</thead>
<tfoot>
<tr>
<th></th>
<th>Name</th>
<th>Middle Name</th>
<th>Surname</th>
<th>Company</th>
<th>Telephone</th>
</tr>
</tfoot>
</table>
</div>
我的JSON文件为:
{"clients":
[
{
"middleName":"",
"lastName":"",
"number":"",
"companyName":",
"firstName":" "
},
............................... 现在有人出了什么问题?顺便说一下,我在这个领域很新,请理解。