- 相關(guān)推薦
如何實(shí)現(xiàn)bootstrap jquery dataTable異步ajax刷新表格數(shù)據(jù)
導(dǎo)語(yǔ)：下面小編給大家提供了如何實(shí)現(xiàn)bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)，大家可以參考閱讀，更多詳情請(qǐng)關(guān)注應(yīng)屆畢業(yè)生考試網(wǎng)。
異步請(qǐng)求
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("新增失敗");
}
})
數(shù)據(jù)處理函數(shù)packagingdatatabledata，異步請(qǐng)求返回的data.test_env_all必須是一個(gè)json格式數(shù)據(jù)
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=[]; //全部行數(shù)據(jù)的list
var banddata = data.test_env_all;
for(var key in banddata){
var tempObj=[]; //一行數(shù)據(jù)的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;
【如何實(shí)現(xiàn)bootstrap jquery dataTable異步ajax】相關(guān)文章：
如何簡(jiǎn)單實(shí)現(xiàn)bootstrap選項(xiàng)卡效果09-14
Jquery.form插件實(shí)現(xiàn)跨域異步上傳功能05-20
BootStrap select2 如何實(shí)現(xiàn)動(dòng)態(tài)改變值09-22
Html5如何實(shí)現(xiàn)文件異步上傳功能09-16
jQuery Mobile + PHP實(shí)現(xiàn)文件上傳10-20
使用python實(shí)現(xiàn)Linux異步epoll的代碼10-27
基于PHP+Ajax實(shí)現(xiàn)表單驗(yàn)證的詳解08-22