如何使用 jquery 数据表对输入值进行排序答案

【问题标题】：How to sort input values with jquery datatables如何使用 jquery 数据表对输入值进行排序
【发布时间】：2019-09-19 10:53:00
【问题描述】：

我正在尝试使用 Jquery "Datatables" 对表中的日期进行排序。

这是我写的html/php：

<td><input id='".$row['id']."' class='delivery_date ".$flatpickr."' data-io='edit' data-date='".$row['delivery_date']."' value='".$row['delivery_date']."' style='color: ".$color."'/></td>

我正在使用“Flatpickr”让用户更改列/单元格中的日期，结果如下：

<td><input id="69" class="delivery_date flatpickr flatpickr-input active" data-io="edit" data-date="2019-10-04" value="2019-10-04" style="color: " type="text" readonly="readonly"></td>

我找到了“Datatables”这个插件，它会搜索输入的“Dom-text”。

/* Create an array with the values of all the input boxes in a column, parsed as numbers */
$.fn.dataTable.ext.order['dom-text-numeric'] = function  ( settings, col )
  {
    return this.api().column( col, {order:'index'} ).nodes().map( function ( td, i ) {
      return $('input', td).val() * 1;
    } );
  }

这个插件没有任何反应。它不起作用，我没有收到任何错误消息。

还有另一个用于对“选择”进行排序的插件，它可以作为一种魅力。

我错过了什么？

这就是我想做的事情：
https://datatables.net/examples/plug-ins/dom_sort.html

这是它在我的表格中的样子：

【问题讨论】：

标签： jquery datatables flatpickr

【解决方案1】：

您可以使用data-sort 以类似于此的方式根据 php-html 的交付日期对您的列进行排序。

<td data-sort='".strtotime($row['delivery_date'])."' data-filter='".$row['delivery_date']."'>
    <input id='".$row['id']."' class='delivery_date ".$flatpickr."' data-io='edit' data-date='".$row['delivery_date']."' value='".$row['delivery_date']."' style='color: ".$color."'/>
</td>

上面的代码将使用strtotime($row['delivery_date'])生成的时间戳对列进行排序。

同样，您可以使用data-filter 进行上述搜索。

如果您要更新输入中的日期，则会考虑对旧值进行排序和过滤。您必须进一步检查如何更新这些值。（Dynamic sorting in jquery DataTables 或尝试搜索类似问题）

【讨论】：