繁体   English   中英

如何在数据表上提取选定行的数据

[英]How can I extract a selected row's data on Datatables

我已经初始化了一个简单的数据表:

//initialise table
var dataTable = $('#example').DataTable({
    searching: false,
    responsive: true

});
//hide unnecessary columns
dataTable.columns(1).visible(false);
dataTable.columns(2).visible(false);
dataTable.columns(3).visible(false);
dataTable.columns(4).visible(false);
dataTable.columns(5).visible(false);
dataTable.columns(6).visible(false);
dataTable.columns(7).visible(false);
dataTable.columns(8).visible(false);

它可以包含任意数量的记录,但我想从所有列中获取值(仅向用户显示 1 个)并将它们插入到输入字段(可能可见也可能不可见)中。 我已经成功地能够使用以下方法选择行:

$('#example tbody').on( 'click', 'tr', function () {

       if ( $(this).hasClass('selected') ) {
           $(this).removeClass('selected');
       }
       else {
           dataTable.$('tr.selected').removeClass('selected');
           $(this).addClass('selected');
       }

   });

我一直在研究 Datatables API、 row()cells()等,虽然我可以查看data()方法,但我根本看不到如何将行上的每个单元格中的数据提取到输入文本字段中同一个网页。 我也看过fnGetSelectedData但我没有走多远,因为它总是通过控制台返回 undefined 。

为了解释用例,它本质上是一个地址查找。 表中的每一列代表地址的一部分,我想从选定行中取出单元格并将其作为用户选择的地址插入到表单中。

任何帮助表示赞赏

解决方案

使用以下代码获取所选行的数据:

var data = $('#example').DataTable().row('.selected').data();

然后您可以填充您的输入字段,如下所示:

$('#name').val(data[0]); 
$('#email').val(data[1]); 

请参阅此 jsFiddle进行演示。

笔记

您可以简化初始化代码:

var dataTable = $('#example').DataTable({
    searching: false,
    responsive: true
    columnDefs: [
       {
          targets: [1,2,3,4,5,6,7,8],
          visible: false
       }
    ]
});

要获取具有值的对象,请使用:

$(yourTableVariable.rows({ selected: true }).data());

然后你可以做这样的事情来获取特定的值(示例 id):

$(yourTableVariable.rows({ selected: true }).data()).attr("id");

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM