javascript - 不工作更新响应数据表中的输入值

Question

将两个数字相乘后，如果响应式数据表不显示

我的代码：

[enter link description here][3]   

标签： javascriptjquerydatatables

Answer 1

发生这种情况是因为您正在将计算值写入元素<td>内部的 DOM（即写入 HTML 单元格）<input>。

您可以看到浏览器中显示的值 - 但为您管理 HTML 表的 DataTables 对象对这个新值一无所知。

因此，当 DataTables 重新绘制表格时（对于“响应”事件），该值会消失。

要解决此问题，您可以更改calculate()函数：

function calculate(idx){
  var inttemp=ex_normalNum($("#mm_" + idx).val());
  var zarb=separateNum($("#nn_" + idx).val() * inttemp);

  //$("#result_" + idx).val(zarb); // DELETE THIS LINE

  // populate the value in DataTables:
  var resultsCell = $('#example').dataTable().api().cell(idx -1, 2);   
  resultsCell.data(zarb).draw();

  // re-position the cursor after the re-draw:
  $("#mm_" + idx).focus();
}

这一行：

var resultsCell = $('#example').dataTable().api().cell(idx -1, 2);

选择表中的相关 DataTable 单元格。请注意，行和列偏移量从零开始 - 因此idx -1表示相关行，并2表示第 3 列。

然后，这一行：

resultsCell.data(zarb).draw();

将计算的值写入 DataTables 内的单元格中 - 然后重新绘制表格以使该值可见。

注意- 包含计算值的单元格将不再是一个<input>字段 - 它只是一个常规<td>单元格。我会推荐这个，因为你实际上没有能力覆盖计算的值。

这是我的测试表：