如何在 SearchPanes for DataTables 中指定选项的自定义顺序

Question

我有一个自定义搜索窗格，我希望它的选项按特定顺序显示。

这是窗格定义：

                    {
                        header: "Dzień",
                        options: [
                            { label: 'poniedziałek', value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "MONDAY"); } },
                            { label: 'wtorek',       value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "TUESDAY"); } },
                            { label: 'środa',        value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "WEDNESDAY"); } },
                            { label: 'czwartek',     value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "THURSDAY"); } },
                            { label: 'piątek',       value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "FRIDAY"); } },
                            { label: 'sobota',       value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "SATURDAY"); } },
                            { label: 'niedziela',    value: function(rowData, rowIdx) { return dayOfWeek(this, rowIdx, "SUNDAY"); } }
                        ],
                        dtOpts: {
                            searching: false
                        }
                    },

以上选项按字母顺序排列，我更愿意自己指定顺序，例如通过为每个选项分配一个数字。 SearchPanes 有可能吗？我找不到执行此操作的内置选项。

此外，除了自定义面板之外，是否可以在非自定义面板上进行类似的排序？

Answer 1

您可以将渲染函数添加到 dtOpts 选项，并使用正交数据为显示定义自定义排序顺序：

dtOpts: {
  searching: false,
  columnDefs: [ { 
    targets: [0], 
    render: function ( data, type, row, meta ) {
      if (type === 'sort') {
        var dayNum;
        switch(data) {
          case 'poniedziałek':
            dayNum = 1;
            break;
          case 'wtorek':
            dayNum = 2;
            break;
          case 'środa':
            dayNum = 3;
            break;
          case 'czwartek':
            dayNum = 4;
            break;
          case 'piątek':
            dayNum = 5;
            break;
          case 'sobota':
            dayNum = 6;
            break;
          case 'niedziela':
            dayNum = 7;
            break;
        }
        return dayNum; 
      } else {
       return data;
     }
    }
  } ],
  order: [[0, 'asc']] // you may not need this line
}

这是可行的，因为 (a) 窗格本身是一个小的 DataTable，并且 (b) dtOpts 选项允许您指定针对窗格的标准 DataTables 选项。

您可能不需要 order: [[0, 'asc']] - 我希望窗格无论如何都会使用它作为默认值。但我把它包括在内以防万一，因为我没有主要 table.

的任何测试数据

我的最终结果：

我还没有尝试过，但我假设您可以对非自定义窗格执行相同的操作（即它们也需要此自定义。）

如何在 SearchPanes for DataTables 中指定选项的自定义顺序

How to specify custom order of options in SearchPanes for DataTables

javascript

jquery

datatables