Datatables 行详细信息。是否可以使用 java 方法中的 json 填充 table

Question

我正在尝试用行详细信息填充数据表，但没有任何效果。它显示正常，但未填充 table。我的 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 代码基本上只是一个 table

<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":" "
},

................................. 现在有人怎么了？顺便说一句，我在这方面很新，请理解。

Answer 1

错误是我的 JSON 文件有客户端而不是数据，它没有加载

Datatables 行详细信息。是否可以使用 java 方法中的 json 填充 table

Datatables row details. Is it possible to populate table with json from java method

ajax

jquery

datatables