Question

我正在尝试使用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文本”。

/* 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

这是我的表格中的外观：

Answer 1

您可以按照与php-html的交付日期相似的方式使用data-sort对列进行排序。

<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或尝试搜索类似的问题）

如何使用jQuery数据表对输入值进行排序

1 个答案: