DataTables動態添加列到表

我正在使用DataTables（datatables.net）顯示來自Ajax源的數據，並且無法自定義它。我想要做的一件事就是添加一個列，這樣我就可以爲每行創建一個「編輯」按鈕。DataTables動態添加列到表

與示例中最接近的是here，但我無法使用ajax源代碼。

目前，我使用下面的代碼，以顯示我的表：

fnServerObjectToArray = function (aElements){ 
    return function (sSource, aoData, fnCallback) { 
     $.ajax({ 
      "dataType": 'json', 
      "type": "POST", 
      "url": sSource, 
      "data": aoData, 
      "success": function (json) { 
       var a = []; 
       for (var i=0, iLen=json.aaData.length ; i<iLen ; i++) { 
        var inner = []; 
        for (var j=0, jLen=aElements.length ; j<jLen ; j++) { 

         inner.push(json.aaData[i][aElements[j]]); 
        } 
        a.push(inner); 
       } 
       json.aaData = a; 
       fnCallback(json); 
      } 
     }); 
    } 
} 

$(document).ready(function() { 
    $('#example').dataTable({ 
     "bProcessing": true, 
     "sAjaxSource": 'get_data.php', 
     "fnServerData": fnServerObjectToArray([ 'username', 'email' ]) 
    }); 
});

來源

2011-06-01 Chad

爲什麼不在aoColumns中使用fnRenderFunction？舉個例子：

aoColumns: [ { "bVisible": false} , null, null, null, null, 
    { "sName": "ID", 
    "bSearchable": false, 
    "bSortable": false, 
    "fnRender": function (oObj) { 
     return "<a href='EditData.php?id=" + oObj.aData[0] + "'>Edit</a>"; 
    } 
    } 
]

你可以使用它來從服務器端格式化值。

見的http://jquery-datatables-editable.googlecode.com/svn/trunk/ajax-inlinebuttons.html（可編輯插件忽略特定設置）類似的例子

來源

2011-06-01 22:27:51

謝謝，我正在尋找！ – Chad 2011-06-01 23:16:13

非常感謝這位伴侶。我在爲我的ajax源數據表需要「操作」列的上下文中使用了這一點。 – 2013-07-22 18:37:06

有同樣的問題在幾個月前。這就是我所做的。
絕不是一個優雅的溶液，但這工作。你可能已經知道，DataTables do have an overload to accept Javascript Arrays。

所以我用$ .ajax調用了。得到我的JSON，解析它到一個JavaScript數組，然後解析我創建了一個額外的元素（anchor標籤）與href="edit.php?email=passed_email"然後在列標題上添加一個名爲Edit的列。這些值被輸入到「aaData」和「aoColumns」。然後桌子被填充。

順便說一句，如果您正在尋找內聯編輯，請檢查以下鏈接。
DataTables editing example - with jEditableplugin

來源

2011-06-01 07:50:05 naveen

你有密碼嗎？請張貼或發送給我。 – Chad 2011-06-01 07:55:55

我沒有和我在一起。只需接受json請求，並將其設置爲2d數組。然後按照示例將其分配給aaData。 – naveen 2011-06-01 07:57:42

我的意思是你添加了列和鏈接的部分。請注意我是新來的JS，甚至更新的jQuery。 – Chad 2011-06-01 08:01:25

我已經創建了編輯按鈕和鏈接等欄目，但通常我通過custominzg我返回的數據做的一切服務器端，然後顯示/隱藏它們與aoColumns選項。我真的不明白你在做什麼：顯示服務器端數據作爲鏈接？

來源

2011-06-01 13:46:35

我想要實現的是能夠添加一列（與編輯按鈕，鏈接等），如你所說的任何表，而不管數據源。當然，該列中的每個字段都應該能夠訪問相應行中的數據。因此，根據我的例子，我應該能夠在列中顯示用戶名和電子郵件。 – Chad 2011-06-01 19:40:11

如果你只有服務器端解決方案，請發送給我，我仍然可以使用它，但我希望有一個解決方案是獨立於數據源的。 – Chad 2011-06-01 19:41:51

我對這個問題的一些RND，並得到this希望這將幫助你。

來源

2013-10-25 10:13:42

DataTables動態添加列到表

回答

相關問題