将列数据设为超链接 (dataTable JQUERY)

Question

我正在尝试使用数据表将列创建为 hyperlink 但没有成功。

函数 successCallback(responseObj){

  $(document).ready(function() {
         $('#example').dataTable( {
        "data":responseObj ,
        "bDestroy": true,
        "deferRender": true ,
        "columns": [
                    { "data": "infomation" },
                    { "data": "weblink" },
                ]
  } );

  } );

}

我需要 weblink 来显示 link 并成为该列中的 hyperlink 以便用户可以单击并重定向到另一个页面。我查看了 render，但由于 link 上的信息较少，我无法成功完成。

我也调查了这个 example 但它不是很有帮助。

Answer 1

    $('#example').dataTable( {
  "columnDefs": [ {
    "targets": 0,
    "data": "download_link",
    "render": function ( data, type, full, meta ) {
      return '<a href="'+data+'">Download</a>';
    }
  } ]
} );

来自documentation。对我来说很清楚很直接，具体是什么你不明白？您看到了什么错误？

有关更完整的示例，请参阅 here

Answer 2

使用columns.render API 方法为单元格动态生成内容。

$('#example').dataTable({
   "data": responseObj,
   "columns": [
      { "data": "information" }, 
      { 
         "data": "weblink",
         "render": function(data, type, row, meta){
            if(type === 'display'){
                data = '<a href="' + data + '">' + data + '</a>';
            }

            return data;
         }
      } 
   ]
});

有关代码和演示，请参阅 this example。

Answer 3

如果您希望根据其他列数据添加 link，则可以使用以下方法。

$('#example').dataTable({
   "data": responseObj,
   "columns": [
      { "data": "information" }, 
      { 
         "data": "weblink",
         "render": function(data, type, row, meta){
            if(type === 'display'){
                data = '<a href="' + row.myid + '">' + data + '</a>';
            }
            return data;
         }
      } 
   ]
});

我刚刚更改了 渲染函数。 data 仅指当前列数据，而 row 对象指整行数据。因此我们可以使用它来获取该行的任何其他数据。

将列数据设为超链接 (dataTable JQUERY)

make column data as hyperlink (dataTable JQUERY)

jquery

datatables

datatables-1.10