JQuery 数据表列的自定义可排序下拉列表

Question

我在 jQuery 数据表中添加了下拉选择。

table.columns().every(function() {
    var column = this;
    var select = $('<select><option value=""></option></select>')
      .appendTo($(column.footer()).empty())
      .on('change', function() {
        var val = $.fn.dataTable.util.escapeRegex(
          $(this).val()
        );
        column
          .search(val ? '^' + val + '$' : '', true, false)
          .draw();
      });
    column.data().unique().sort().each(function(value, j) {
      select.append('<option value="' + value + '">' + value + '</option>')
    });
  });

以下是完整的源代码 plunker link.

当我打开下拉列表时，值按字符串而不是整数排序。例如这里的下拉菜单给出了选择

[1,10,11,2,...] && [Item 1,Item 10,Item 11,...]

我想回答

[1,2,3,4,..10,11..] && [Item 1,Item 2,Item 3,...]

Answer 1

您可以使用 Sorting plugins

像这样修改您的代码：

var table = $('#example').DataTable({
    "columnDefs": [
            { "type": "natural", targets: 0 },
            { "type": "natural", targets: 1 }
    ]
});

结果可以在这里看到：https://plnkr.co/edit/MJgKWrYpFmmr0v43hKd4?p=preview

JQuery 数据表列的自定义可排序下拉列表

Custom sortable dropdown for JQuery datatable column

javascript

jquery

jquery-ui

jquery-plugins

datatables