为插件添加按钮行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>'; } 
      } 
     ] 
    }); 
}); 

我不知道这是否依赖于数据表的新版本或其他服务器的配置（但我的表被配置以同样的方式...）。