如何通过 jQuery 数据表中的值查找特定行？

Question

我想在模式窗口外的数据表中按值查找特定行。 我在看https://datatables.net/reference/type/row-selector，但据我所知，这一切都基于选择器或内部 ID。 就我而言，我有 2 列我希望能够在其中查找特定行以在 ajax 请求后更新记录。

success: function (data) {
                if (data.status_id > 0) {
                    alert(data.info);
                } else {
                    alert(data.info);
                }
                contractsTable.row.add(dataJSON).draw(false);
         }

编辑

现在这里是我的代码 - 我已经构建了自己独特的 rowid 并使用了 selector by id

检索数据对象

...
var d = datatable.row(this).data();
... set form values and so on

保存并刷新数据表

$('#contractEditSave').on('click', function (e) {

        dataJSON = {
            id: $('#contractEditForm').data('contractid'),
            member_id: $('#contractEditForm').data('memberid'),
            member_name: $('#contractEditModalTitle').text(),
            box_id: $('#contractBox').val(),
            name: $('#contractName').val(),
            description: $('#contractDescription').val(),
            start: $('#contractStart').val(),
            end: $('#contractEnd').val(),
            amount: $('#contractAmount').val(),
            unit: $('#contractUnit').val(),
            max: 1
        };

        $.ajax({
            type: 'POST',
            url: '/save',
            data: JSON.stringify(dataJSON),
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function (data) {
                if (data.status_id == 0)
                    datatable.row('#' + dataJSON.id).data(dataJSON); //if update
                    ...
                } else {
                    datatable.row.add(dataJSON).draw(false); //if insert
                    ...
                }



                $("#contractEditModal").modal('hide');

            }
        });
    });

Answer 1

我发现 fnFindCellRowIndexes 插件非常慢，因为它在每个单元格上调用 fnGetData，这本身就是一个可怕的 CPU 猪。结果证明要简单得多，运行速度也快了几个数量级。每列或整个表的 data() 在您请求时已经按排好序的列排序。 所以从字面上看，您所要做的就是请求 column(c).data()并遍历该数组以查找您要查找的任何内容，并且索引将与当前排序的行号匹配。在 Typescript 中，这基本上是这样的：

public findRows(s:string,col:number):number[] {
    let r:number[] = [];
    let dat:any = $('#example').DataTable().column(col).data();
    let len:number = dat.length;
    for (let k=0;k < len;k++) {
        if ((<string>dat[k]).toLowerCase().includes(s.toLowerCase())) r.push(k);
    }
    return r;
}

Answer 2

您可以使用fnFindCellRowIndexes 查找在给定列中保存某些数据的行索引。

然后你可以使用cell().data() API 方法来更新单元格。

var table = $('#example').DataTable();

var rowId = $('#example').dataTable()
   .fnFindCellRowIndexes('Angelica Ramos', 0);

table
   .cell(rowId, 0)
   .data('Angelica Ramos (UPDATED)')
   .draw(false);

请注意，除了 jQuery DataTables CSS/JS 文件之外，您还需要包含 fnFindCellRowIndexes.js。

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