jQuery - 動態添加表格單元格的值來自AJAX調用

使用jQuery，當表格單元本身以編程方式生成時，如何使用jQuery調用填充表格單元格的值？jQuery - 動態添加表格單元格的值來自AJAX調用

我構建的工作原理如下頁面：

執行初始AJAX調用，期待一個JSON陣列，例如項目名稱的列表
AJAX回調使用jQuery.each通過陣列
每個數組項回調迭代增加了一排桌子，與項目名稱
還有其他細胞（比方說他們代表項目位置），但爲了得到這個值，需要進行另一個AJAX調用（在示例中標記爲*） - 我該如何實現此功能？

樣本表結構：

Name  Location1 Location2 
================================ 
Item1   *   * 
Item2   *   *

其他考慮因素：

需要滿足動態數列，即位置。這就是爲什麼我
我知道有大量的電話，但沒有在意，對於這個問題
我使用DataTables插件
我想知道這是否確實沒有簡單地做更改Web服務後端以生成整個表，或者每次至少生成一行。通過執行每個單元格的查詢，我可以重新使用現有的調用。

注：我通過使用下面的代碼添加表格行，我打算改變它。 Reference

$("#tableID").find("tbody").append($('<tr>') 
    .append($('<td>').text(...)) 
    .append($('<td>').text(...)) 
    .append($('<td>').text(...)) 
);

我想我大概可以生成每個小區ID，然後火了基於該AJAX調用，但似乎有點麻煩。有沒有更優雅的方式來做到這一點？

理想情況下，還可以調整任何解決方案以處理向表中添加額外列的用例，上面的示例表中的Location3。

來源

2015-04-06 invincible

@RawN更新了問題 - 我怎麼能夠實現第4步？其餘主要用於上下文 – invincible

如果您使用dataTables插件，則不會附加自己的html，插件將不會識別它。使用API添加數據 – charlietfl

@charlietfl採取的要點 - 我還沒有涉及到dataTables集成，典型的方法應該是生成一個完整的行然後將它傳遞給API。在這個問題中，我正在尋找關於如何管理所有單元格回調的想法 – invincible

var nEditing = null; 
$('#query_for_search_result_table_new').click(function (e) { 
      e.preventDefault(); 
      var aiNew = oTable.fnAddData(['', '', '', '<a class="edit" href="">Edit</a>', '<a class="cancel" data-mode="new" href="">Cancel</a>', '']); 
      var nRow = oTable.fnGetNodes(aiNew[0]); 
      editRow(oTable, nRow); 
      nEditing = nRow; 
     }); 

function editRow(oTable, nRow) { 

      var aData = oTable.fnGetData(nRow); 
      var jqTds = $('>td', nRow); 
      jqTds[0].innerHTML = $("#dvFieldLabel").html(); 
      jqTds[1].innerHTML = $("#dvFieldOperator").html(); 
      jqTds[2].innerHTML = '<input type="text" class="m-wrap small" value="' + aData[2] + '">'; 
      jqTds[3].innerHTML = '<a class="edit" href="">Save</a> &nbsp; <a data-mode="new" class="cancel" href="">Cancel</a>'; 
      jqTds[4].innerHTML = '<label>' + aData[0] + ' ' + aData[1] + ' ' + aData[2] + '</label>'; 



     }

來源

2015-04-06 16:15:32

jQuery - 動態添加表格單元格的值來自AJAX調用

回答

相關問題