我的前端时bootstrap和jqurey,后端是django。
后台django传入前端json字符串,通过datatable来显示数据。我在前端通过ajax到后端调取数据库内容,生成json字符串传入前端,然后就
出问题了:datatable的样式实效,原先好好的分页、搜索也不起作用了。下面的我的代码:
后端
df_arp_mysql = df_arp_mysql.to_json()#此处将一个dataframe转为json
return JsonResponse(df_arp_mysql,safe = False)#返回前端json
前端
$.ajax({
url:'{% url "ajax_update_ARP" %}',
type:"POST",
data:{"json_update_ARP":JSON.stringify(ARP_list_td) },
success:function(net_arp){
json_arp = JSON.parse(net_arp);//将后端返回的值转化为jq的json
str = "" //以下生成datatable数据区的html文本
for(var i = 0;i <(Object.keys(json_arp['IP']).length); i++)
{
str =str + "<tr id ='ARP_table'>" +
"<td><input type = 'radio' name = 'ARP_select' ></td>" +
"<td>" + json_arp['Num'][i] + "</td>" +
"<td>" + json_arp['IP'][i] + "</td>" +
"<td>" + json_arp['bak'][i] + "</td>" +
"<td>" + json_arp['VLAN'][i] + "</td>" +
"<td>" + json_arp['interface'][i] + "</td>" +
"<td>" + json_arp['collect_time'][i] + "</td>" +
"</tr>";
}
$("#arp_list").html(str);//在datatable数据区重写html
//下面调用datatable方法。datatable_ARP_list是ID
$("#datatable_ARP_list").DataTable({
"bLengthChange": false,
"singleSelect" : false,
"bFilter": true ,
retrieve: true }) ; //retrieve: true 参数的用途:丢弃原有数据并复用
});
我的ajax放在windows.load()事件中初始化,所有都正常的啊,重新加载就出问题了。请教各位,我到底是哪里错了?