数据表如何使第一个字段可单击

时间:2018-01-08 12:06:37

标签: javascript jquery datatables

我正在使用带有服务器端处理的数据表。

这是我的数据

name   type   cost
abc    a      $5
bac    d      $10

我希望第一个字段可以点击mydomain.com/?abc 第二个字段为mydomain.com?bac

但数据填充了mysql所以不知道如何做到

2 个答案:

答案 0 :(得分:0)

使用columns.render选项为单元格生成内容。

例如:

var table = $('#example').DataTable({
   columnDefs: [
      {
         targets: 0,
         render: function(data, type, full, meta){
            if(type === 'display'){
               data = '<a href="' + encodeURI('http://www.example.com/?' + data) + '">' + data + '</a>';
            }

            return data;
         }
      }
   ]
});

请参阅this example以获取代码和演示。

答案 1 :(得分:0)

您可以尝试构建计算列并向其添加锚点。以下this reference pagethis thread on calculated columns示例可能会让您知道如何操作。

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

如果您想捕获点击事件并以自定义方式处理它,那就有点复杂了。当我需要在一段时间内同时破解这样的东西时,我最终不得不使用计算列将HTML类添加到我想要进行交互的单元格中,等待DataTable被填充(听{4}}或{{1现在不确定),查询我使用的HTML类的元素的DOM,并以这种方式附加我的事件处理程序。这种情况的主要原因是当文档初始化并将处理程序附加到DOM元素时,表行还没有,所以事件不会自动附加。