jquery datatable display创建表后行中没有数据可用行运行时(javascript)

You*_*ddh 2 html javascript datatables

我试图显示Jquery DataTable我创建的数据的table(),JavaScript 但有些表如何显示这样.

在此输入图像描述
Jquery DataTable正确显示但功能不起作用,即使我搜索然后显示通知 No data available in table 即使我在页面中右键单击并且View Page Source新行不显示它们.我不是没有什么问题听到我把数据表的初始化代码,

$(document).ready(function() {
    $('#example').dataTable({
        "sPaginationType" : "full_numbers"
    });
});
Run Code Online (Sandbox Code Playgroud)

表格中插入行的代码

$("#example").find("tr:not(:first)").remove();

 for (var i = 0; i < response.userListReturns.length; i++) {
    var table = document.getElementById("example"); 
    var thisRowCount = table.rows.length;                   
    var row = table.insertRow(thisRowCount);

     var cell1 = row.insertCell(0);
     cell1.style.paddingTop = '4px';
     cell1.style.paddingBottom = '4px';
     cell1.style.textAlign = "center";
     if(i%2!=0)
     cell1.style.backgroundColor="#BAD6F7";
     var element0 = document.createElement("input");
     element0.type = "radio";
     element0.id = "chkEditDelet"+i;
     cell1.appendChild(element0);

     var cell2 = row.insertCell(1);   
     cell2.style.paddingTop = '4px';
     cell2.style.paddingBottom = '4px';
     cell2.style.textAlign = "left";
     if(i%2!=0)
     cell2.style.backgroundColor="#BAD6F7";
     cell2.innerHTML= i+1;


     var cell3 = row.insertCell(2);   
     cell3.style.paddingTop = '4px';
     cell3.style.paddingBottom = '4px';
     cell3.style.textAlign = "left";
     if(i%2!=0)
     cell3.style.backgroundColor="#BAD6F7";//c4ffc4
     cell3.style.whiteSpace="nowrap";
     cell3.innerHTML= response.userListReturns[i].userName;

     var cell4 = row.insertCell(3);   
     cell4.style.paddingTop = '4px';
     cell4.style.paddingBottom = '4px';
     cell4.style.textAlign = "left";
     if(i%2!=0)
     cell4.style.backgroundColor="#BAD6F7";//c4ffc4
     cell4.innerHTML= response.userListReturns[i].userAddress;

     var cell5 = row.insertCell(4);   
     cell5.style.paddingTop = '4px';
     cell5.style.paddingBottom = '4px';
     cell5.style.textAlign = "left";
     if(i%2!=0)
     cell5.style.backgroundColor="#BAD6F7";//c4ffc4
     cell5.innerHTML= response.userListReturns[i].userPhoneNo;

     var cell6 = row.insertCell(5);   
     cell6.style.paddingTop = '4px';
     cell6.style.paddingBottom = '4px';
     cell6.style.textAlign = "left";
     if(i%2!=0)
     cell6.style.backgroundColor="#BAD6F7";//c4ffc4
     cell6.innerHTML= response.userListReturns[i].education;

     var cell7 = row.insertCell(6);   
     cell7.style.paddingTop = '4px';
     cell7.style.paddingBottom = '4px';
     cell7.style.textAlign = "left";
     if(i%2!=0)
     cell7.style.backgroundColor="#BAD6F7";//c4ffc4
     cell7.innerHTML= response.userListReturns[i].userLiginName;

     var cell8 = row.insertCell(7);   
     cell8.style.paddingTop = '4px';
     cell8.style.paddingBottom = '4px';
     cell8.style.textAlign = "left";
     if(i%2!=0)
     cell8.style.backgroundColor="#BAD6F7";//c4ffc4
     cell8.innerHTML= '********';
}
Run Code Online (Sandbox Code Playgroud)

Sha*_*awn 7

您似乎手动添加行,我不确定它是否适用于数据表.我建议你阅读那里api,如果你坚持这样做,你可以使用fnAddData,直接从网站使用看起来像:

var giCount = 2;
$(document).ready(function() {
  $('#example').dataTable();
} );

function fnClickAddRow() {
  $('#example').dataTable().fnAddData( [
  giCount+".1",
  giCount+".2",
  giCount+".3",
  giCount+".4" ]
);

giCount++;
Run Code Online (Sandbox Code Playgroud)

}

然后,您仍然可以通过CSS设置表格样式.