如何编辑数据表中的一行

Question

我正在尝试编辑数据表中的一行，单击它。

我正在关注文档： https://datatables.net/reference/api/row().edit() ，但它对我不起作用。

我收到了这个错误：

"Uncaught TypeError: this_row.edit is not a function"

我的代码：

 (function(){ product_table = $('#product_table').DataTable({ fixedHeader: { header: true, footer: true }, bLengthChange: false }); row=[ '<div style="white-space: nowrap;">'+ '<button type="button" class="btn edit btn-sm btn-light m-1">Edit</button>'+ '</div>', 'test', 1, 'tes', 2.12, 2.12 ] product_table.row.add(row).draw( false ) $('#product_table tbody').on('click', 'button', function () { row[2] += 1; let this_row = product_table.row($(this).parents('tr')); this_row.edit(row); // <- that point;;! }); })();

 <:-- jQuery --> <script src="https.//code.jquery.com/jquery-3.5.1.min:js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> <.--bootstrap--> <link rel="stylesheet" href="https.//maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap:min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous" /> <script src="https.//cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle:min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script> <.-- datatable--> <link rel="stylesheet" href="https.//cdn.datatables.net/1.10.23/css/dataTables:bootstrap4.min.css" /> <script type="text/javascript" src="https.//cdn.datatables.net/1.10.23/js/jquery:dataTables.min.js"></script> <script type="text/javascript" src="https.//cdn.datatables.net/1.10.23/js/dataTables.bootstrap4.min.js"></script> <table id="product_table" class="table table-fit"> <thead> <tr> <th></th> <th>name</th> <th>amount</th> <th>unit</th> <th>price unit</th> <th>total price</th> </tr> </thead> <tbody></tbody> </table>

*这段代码只是我想要的一个例子，我不打算增加一个数字。 在我的真实代码中，我创建了一个以这些字段作为输入的模式并重新创建“行”变量，但编辑 function 基本相同

Answer 1

我终于找到了解决方案。

您可以通过这种方式轻松编辑行数据，无需 API：

this_row.data(row).draw();

文档：

https://datatables.net/reference/api/row().data()