Javascript 在DataTable中显示0项中的0到0项

您好，我是新来的，我正在使用dataTable显示我的，mysql数据。因此，我的数据显示正确，但这里我的

dataTable

页脚无法正常工作

这是我的代码

UI_CRUD.prototype.refreshTable = function(params = {}){
    var tableBody = $('.view-datatable tbody');
    var dataUrl = this.moduleURL+'/alenter code herel';
    var title = this.moduleTitle;
    // console.log(this.moduleTitle);
    console.log('all ..');
    $.ajax({
        url: dataUrl,
        data : params,
    })
    .done(function(data) {
        var html = '';
            $.each(data, function(index, item) {
                 html+= '<tr>';
                    $.each(item, function(index, data) {
                        (index != 'id') ? html+= '<td>'+data+'</td>' : html+=''; 
                    });
                    html+= '<td class="actions">' +
                                '<i class="icon-eye text-primary view-btn" data-id="'+item.id+'">'+
                                '</i>'+
                                '<span></span>'+
                                '<i class="icon-pencil7 text-primary edit-btn" data-id="'+item.id+'">' +
                                '</i>'+
                                '<span></span>'+
                                '<i class="icon-bin sweet_combine text-danger delete-btn" data-id="'+item.id+'">' +
                                '</i>'+
                            '</td>';
                 html+= '</tr>';

            });
        tableBody.html(html);
    })
    .fail(function(res) {
        console.error(res,'UI_CRUD ERR : ');
    }); 
}

这是响应json [{“id”：39，“公司代码”：“FFDE”，“公司名称”：“dsfsdf”，“地址”：‌​fsdfsd，fsdf，fdsf，fsd‌​f.“CO_TELNO”：“12345‌​6789，“CO_传真号”：“12‌​3456789“}，{“id”：41，“‌​公司代码：“AAAA”‌​公司名称：“FDSF”、“A”‌​地址：“dsfdsf，dfds‌​f、 dsffdsf、fdsfsd、C‌​O_TELNO:“123456789”‌​,“CO_传真号”：“1234567‌​89“}]

这是我的输出页面

UI_CRUD.prototype.refreshTable = function(params = {}){
    var tableBody = $('.view-datatable tbody');
    var dataUrl = this.moduleURL+'/alenter code herel';
    var title = this.moduleTitle;
    // console.log(this.moduleTitle);
    console.log('all ..');
    $.ajax({
        url: dataUrl,
        data : params,
    })
    .done(function(data) {
        var html = '';
            $.each(data, function(index, item) {
                 html+= '<tr>';
                    $.each(item, function(index, data) {
                        (index != 'id') ? html+= '<td>'+data+'</td>' : html+=''; 
                    });
                    html+= '<td class="actions">' +
                                '<i class="icon-eye text-primary view-btn" data-id="'+item.id+'">'+
                                '</i>'+
                                '<span></span>'+
                                '<i class="icon-pencil7 text-primary edit-btn" data-id="'+item.id+'">' +
                                '</i>'+
                                '<span></span>'+
                                '<i class="icon-bin sweet_combine text-danger delete-btn" data-id="'+item.id+'">' +
                                '</i>'+
                            '</td>';
                 html+= '</tr>';

            });
        tableBody.html(html);
    })
    .fail(function(res) {
        console.error(res,'UI_CRUD ERR : ');
    }); 
}

这就是答案

及

---

经过多次努力，我修复了错误

问题在于应用dataTable插件。在我删除js文件并添加新的dataTable之后

<table class="table view-datatable">
    <thead>
        <tr>
            <th>Company Code              </th>
            <th>Company Name              </th>
            <th>Company Address           </th>
            <th>Telephone No.             </th>
            <th>Fax No.                   </th>
        </tr>
    </thead>
    <tbody></tbody>

公司代码
公司名称
公司地址
电话号码。
传真号码。

var table=$（'.view datatable'）。datatable（{
“处理”：对，
“检索”：正确，
“ajax”：{
“url”：ajax\uurl
},
“列”：[{
“数据”：“公司代码”
}, {
“数据”：“公司名称”
}, {
“数据”：“地址”
}, {
“数据”：“CO_TELNO”
}, {
“数据”：“CO_传真号”
}, {
数据：空，
类名：“数据表中心”，
},],
“rowCallback”：函数（行、数据、索引）{
$（'td:eq（5）”，第行）.html(
''+
''+
'    '+
'' +
''+
'    '+
'' +
''
);
},
“pagingType”：“完整编号”，
按钮：{
按钮：[
{
扩展：“colvis”，
类名：“btn btn默认”
},
{
文本：“添加新内容”，
类名：“添加新btn bg-blue-800 ui添加新”，
行动：职能（e）{
//UI_添加模型（“显示”）；
}
},
{extend:'copy'}，
//{extend:'csv'}，
{extend:'excel'}，
{extend:'pdf'}，
{扩展：'打印'}
]
}
} );

这是JSon响应[{“id”：39，“CO_通信码”：“FFDE”，“CO_名称”：“dsfsdf”，“地址”：“fsdfsd，fsdf，fdsf，fsdf”，“CO_TELNO”：“123456789”，“CO_传真号”：“123456789”}，{“id”：41，“CO_通信码”：“AAAA”，“CO_名称”：“fdfdfdfdfdsf”，“地址”：“dsfdsf我相信这与您的服务器响应有关，您可以向我们展示响应吗？在调用

dataTable（）

$（'#示例'）的地方显示完整代码。dataTable（{serverSide:true，ajax:{url:'/data source'，键入：'POST'}）；我添加了每一个细节。请检查一下。非常感谢。

<table class="table view-datatable">
    <thead>
        <tr>
            <th>Company Code              </th>
            <th>Company Name              </th>
            <th>Company Address           </th>
            <th>Telephone No.             </th>
            <th>Fax No.                   </th>
        </tr>
    </thead>
    <tbody></tbody>

var table = $('.view-datatable').DataTable( {
           "processing" : true,
           "retrieve": true,
           "ajax" : {
               "url" : ajax_url
           },
           "columns" : [  {
               "data" : "CO_COMCODE"
           }, {
               "data" : "CO_NAME"
           }, {
               "data" : "Address"
           }, {
               "data" : "CO_TELNO"
           }, {
               "data" : "CO_FAXNO"
           }, {
               data: null,
               className: "dataTable-center",
           },],
           "rowCallback": function( row, data, index ) {
               $('td:eq(5)', row).html(
                   '<i class="icon-eye text-primary view-btn" data-id="'+data.id+'">'+
                   '</i>'+
                   '<span>    </span>'+
                   '<i class="icon-pencil7 text-primary edit-btn" data-id="'+data.id+'">' +
                   '</i>'+
                   '<span>    </span>'+
                   '<i class="icon-bin sweet_combine text-danger delete-btn" data-id="'+data.id+'">' +
                   '</i>'
               );
           },
           "pagingType": "full_numbers",
           buttons: {
               buttons: [
                   {
                       extend: 'colvis',
                       className: 'btn btn-default'
                   },
                   {
                       text: 'Add New',
                       className: 'add-new btn bg-blue-800 ui-add-new',
                       action: function(e) {
                           // UI_addModel('show');
                       }
                   },
                   {extend: 'copy'},
                   // {extend: 'csv'},
                   {extend: 'excel'},
                   {extend: 'pdf'},
                   {extend: 'print'}
               ]
           }
       } );