快捷導(dǎo)航

bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)的實(shí)現(xiàn)方法

更新時(shí)間：2017年02月10日 15:21:07 作者：拖油瓶ZZH

這篇文章主要介紹了bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)的實(shí)現(xiàn)方法,需要的朋友可以參考下

異步請求

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，異步請求返回的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;
 }

以上所述是小編給大家介紹的bootstrap jquery dataTable 異步ajax刷新表格數(shù)據(jù)，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

JS 毫秒轉(zhuǎn)時(shí)間示例代碼
毫秒轉(zhuǎn)時(shí)間的方法有很多，在本文將為大家介紹下js中是如何實(shí)現(xiàn)的，感興趣的朋友可以參考下
2013-09-09
javascript 拷貝節(jié)點(diǎn)cloneNode()使用介紹
這篇文章主要介紹了javascript 節(jié)點(diǎn)操作拷貝節(jié)點(diǎn)cloneNode()的使用,需要的朋友可以參考下
2014-04-04
js文件中直接alert()中文出來的是亂碼的解決方法
下面小編就為大家?guī)硪黄猨s文件中直接alert()中文出來的是亂碼的解決方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-11-11
微信小程序?qū)崿F(xiàn)虎年春節(jié)頭像制作
春節(jié)來臨之際，看到有網(wǎng)友分享了網(wǎng)頁版的虎年頭像制作工具。本文將為大家介紹一個(gè)虎年春節(jié)頭像制作小程序，文中的示例代碼講解詳細(xì)，需要的可以參考一下
2022-02-02
一個(gè)簡單的js動畫效果代碼
前段時(shí)間為了做動畫,學(xué)習(xí)了一下tween算法的使用,這幾天根據(jù)tween算法,然后根據(jù)各種材料參考,做了一個(gè)簡單的動畫函數(shù).
2010-07-07
Javascript promise異步編程淺析
這篇文章主要介紹了Javascript promise異步編程，Promise 是異步編程的一種解決方案，可以替代傳統(tǒng)的解決方案–回調(diào)函數(shù)和事件，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧
2023-04-04
可選擇和輸入的下拉列表框示例
如果想實(shí)現(xiàn)可選擇和輸入的下拉列表框，那么下面有個(gè)不錯(cuò)的示例，希望大家可以參考下
2013-11-11
js實(shí)現(xiàn)交換運(yùn)動效果的方法
這篇文章主要介紹了js實(shí)現(xiàn)交換運(yùn)動效果的方法,涉及javascript操作頁面元素與相關(guān)樣式實(shí)現(xiàn)交換運(yùn)動效果的技巧,需要的朋友可以參考下
2015-04-04
JavaScript實(shí)現(xiàn)九宮格抽獎
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)九宮格抽獎，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-06-06
JavaScript請求后臺數(shù)據(jù)的常用方法匯總
這篇文章主要介紹了JavaScript請求后臺數(shù)據(jù)的幾種常用方式,本文通過示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2023-06-06