jQuery DataTables 获取选定的行值

Posted

技术标签:

【中文标题】jQuery DataTables 获取选定的行值【英文标题】:jQuery DataTables Getting selected row values 【发布时间】:2015-05-25 08:26:24 【问题描述】:

我正在使用 jQuery 数据表。我使用 http://www.datatables.net/examples/api/select_row.html 完成了它 现在我想获取选定的行值 id

脚本:

 $(document).ready(function() 
 var table = $('#example').DataTable();
 $('#example tbody').on( 'click', 'tr', function () 
    $(this).toggleClass('selected');
 );

$('#button').click( function () 
    alert( table.rows('.selected').data().length +' row(s) selected' );
 );
 );

还有 HTML 代码:

 <table id="example" class="display" cellspacing="0" >
    <thead>
        <tr>
            <th>Id</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </thead>

    <tfoot>
        <tr>
            <th>Id</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </tfoot>

    <tbody>
        <tr>
            <td>1</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>$170,750</td>
        </tr>
         </table>

现在我能够获得选定的行数。现在我想获得选定的行 ID。任何人都可以指导我实现它。

【问题讨论】:

【参考方案1】:

你可以遍历行数据

$('#button').click(function () 
    var ids = $.map(table.rows('.selected').data(), function (item) 
        return item[0]
    );
    console.log(ids)
    alert(table.rows('.selected').data().length + ' row(s) selected');
);

演示:Fiddle

【讨论】:

嗨有什么办法可以让某些行默认选中? 即使隐藏列,该方法也会获取数据。如何获取可见列的行数据? 能不能得到对应的tr jquery对象?【参考方案2】:

更多的是评论而不是答案 - 但我还不能添加 cmets:感谢您的帮助,计数是简单的部分。只是为了其他可能来这里的人。我希望它可以为您节省一些时间。

我花了一段时间才从行中获取 属性 并了解如何从 data() 对象中访问它们(data() 是数组和属性可以通过添加点而不是括号来读取:

$('#button').click( function () 
    for (var i = 0; i < table.rows('.selected').data().length; i++)  
       console.log( table.rows('.selected').data()[i].attributeNameFromYourself);
    
 );

(顺便说一句:我使用 AJAX 和 JSON 获取表的数据)

【讨论】:

我有类似的要求,但在我的情况下,我的 ID 是隐藏的 "bVisible": false?那么如何获取所选行的隐藏列值呢? 嗯,该列应该仍然在 data() 对象中,因为它只是被隐藏了。你不能迭代数据吗?我在我的数据集中寻找隐藏的 objectId,看起来像这样:var oSelectRows = oMyTable.rows(".selected").data(); for (var inttt = 0; inttt &lt; oSelectRows.length; inttt++) sObjektIdListe += ""+oSelectRows[inttt].objektId; var oSelectRows = oMyTable.rows(".selected").data(); for (var inttt = 0; inttt &lt; oSelectRows.length; inttt++) console.log(" ID "+ oSelectRows[inttt].objektId); .. 我怎样才能正确格式化? 你能评论我的帖子吗? ***.com/questions/34869730/…【参考方案3】:
var table = $('#myTableId').DataTable();
var a= [];
$.each(table.rows('.myClassName').data(), function() 
a.push(this["productId"]);
);

console.log(a[0]);

【讨论】:

以上是关于jQuery DataTables 获取选定的行值的主要内容,如果未能解决你的问题,请参考以下文章

如何在 WPF C# 中的 DataGrid 的 TextBoxes 中获取选定的行值

Javascript jQuery插件DataTables取消选择元素

如何获取 DevExpress XtraGrid 的选定行值?

动态生成列名时如何获取kendo选择的行值

如何从 DataTables 中的选定数据中获取数据

jQuery DataTables:如何通过 tr 的行 ID 获取行索引(或 nNode)?