爲插件添加按鈕行JQuery DataTables

Question

我正在使用插件「DataTables」，我想要逐行添加圖片，當用戶單擊時，調用另一個url。

我跟着www.datatables.net的例子，但是給下面的錯誤：從數據源請求未知參數「4」的第0行：

數據表警告（表ID =「myDataTable」）。

記錄顯示在屏幕上

<h2>Index</h2> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     var oTable = $('#myDataTable').dataTable({ 
      "bServerSide": true, 
      "sAjaxSource": "AjaxHandler", 
      "bProcessing": true, 
      "sPaginationType": "full_numbers", 
      "aoColumns": [ 
         { "mDataProp": "ID", "bSortable": false }, 
         { "mDataProp": "Nome", "sTitle": "Identificação do produto" }, 
         { "mDataProp": "Address", "sTitle": "Descrição do produto" }, 
         { "mDataProp": "Town" }, 
         { "fnRender": function (o) {return '<a href=/Produto/Detalhar/' + o.aData[0] + '>' + 'More' + '</a>';}} 
      ], 
     }); 
    }); 
</script> 


<table id="myDataTable" class="display"> 
    <thead> 
     <tr> 
      <th>ID</th> 
      <th>Company name</th> 
      <th>Address</th> 
      <th>Town</th> 
      <th>Action</th> 
     </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table> 

Answer 1

我真的不知道數據表（不夠），但你應該嘗試這種方式：{不知道mDataProp已過時或不}

$(document).ready(function() { 

     var oTable = $('#myDataTable').dataTable({ 
      "bServerSide": true, 
      "sAjaxSource": "AjaxHandler", 
      "bProcessing": true, 
      "sPaginationType": "full_numbers", 
      "aoColumns": [ 
         { "mData": "ID", "bSortable": false }, 
         { "mData": "Nome", "sTitle": "Identificação do produto" }, 
         { "mData": "Address", "sTitle": "Descrição do produto" }, 
         { "mData": "Town" }, 
         { "mData": null, 
        "bSortable": false, 
      "mRender": function (o) {return '<a href=/Produto/Detalhar/' + o.aData[0] + '>' + 'More' + '</a>';} 
      } 
      ] 
     }); 
    }); 

確保你的數據腳與你的列聲明，你應該有一個json數據ID，Nome，地址和城鎮作爲Ajax響應。 如果你的第一個數據是ID不是ID，你會得到一個我認爲的錯誤。

Answer 2

我正在使用dataTables版本1.10.0-dev，並且接受的解決方案對我無效，因爲o.aData未定義。相反，我擁有所有返回服務器端的json對象的屬性。所以這是我的解決方案：

$(document).ready(function() { 
    var oTable = $('#myDataTable').dataTable({ 
     "bServerSide": true, 
     "sAjaxSource": "AjaxHandler", 
     "bProcessing": true, 
     "sPaginationType": "full_numbers", 
     "aoColumns": [ 
      { "mData": "ID", "bSortable": false }, 
      { "mData": "Nome", "sTitle": "Identificação do produto" }, 
      { "mData": "Address", "sTitle": "Descrição do produto" }, 
      { "mData": "Town" }, 
      { 
       "mData": null, 
       "bSortable": false, 
       "mRender": function (o) { return '<a href=/Produto/Detalhar/' + o.Id + '>' + 'More' + '</a>'; } 
      } 
     ] 
    }); 
}); 

我不知道這是否依賴於數據表的新版本或其他服務器的配置（但我的表被配置以同樣的方式...）。