首页 > 开发 > AJAX > 正文

bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法

2024-09-01 08:33:51
字体:
来源:转载
供稿:网友

异步请求         

var postData = {    "env_name" : new_env_name,    "env_url": new_env_url,    "env_desc" : new_env_desc   };   $.ajax({    type: 'POST',    url : '/test_env_add/',    data : postData,    dataType : 'json',    success : function(data){     $('#table_test_env').dataTable().fnClearTable(); //清空表格     $('#table_test_env').dataTable().fnAddData(packagingdatatabledata(data),true); //刷下表格     $("#modal-container-648308").modal("hide");    },    error:function(data){     alert("新增失败");    }   })

数据处理函数packagingdatatabledata,异步请求返回的data.test_env_all必须是一个json格式数据

 function packagingdatatabledata(data){   var editHtml='<button href="#modal-container-648308" rel="external nofollow" data-toggle="modal" class="btn btn-xs btn-info" onclick="test_env_modify(this)"> <i class="icon-edit bigger-120"></i> </button> <button href="#modal-container-648300" rel="external nofollow" data-toggle="modal" class="btn btn-xs btn-danger" onclick="test_env_delete(this)"> <i class="icon-trash bigger-120"></i> </button>';  var a=[]; //全部行数据的list  var banddata = data.test_env_all;  for(var key in banddata){   var tempObj=[];  //一行数据的list   tempObj.push(banddata[key].id);   tempObj.push(banddata[key].name);   tempObj.push(banddata[key].url);   tempObj.push(banddata[key].desc);   tempObj.push(editHtml);   a.push(tempObj);  }  return a; }

以上所述是小编给大家介绍的bootstrap jquery dataTable 异步ajax刷新表格数据,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对VeVb武林网网站的支持!


注:相关教程知识阅读请移步到JavaScript/Ajax教程频道。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表