Question

我已升级到DataTables 1.10，但在使用column.data或column.render使用不同的值进行排序和显示时遇到问题。

数据如下：

[
    {
      "title":"Overview Report: (2014-07-12 11:49 - 2014-07-12 23:49)",
      "reportDateRangeMilliseconds":43200000,
      "DateRange":"12 hours"
   },
   {
      "title":"User Overview Report: (2014-07-12)",
      "reportDateRangeMilliseconds":86400000,
      "DateRange":"1 day"
   },
   {
      "title":"Activity Report: (2014-07-31 23:00 - 2014-08-03 00:00)",
      "reportDateRangeMilliseconds":176400000,
      "DateRange":"2 days, and 1 hour"
   }
]

我想创建一个显示DateRange的列，并使用reportDateRangeMilliseconds

进行排序

我试过了：

$('#reportList').dataTable({
    "data" : reportData,    
    "columns" : [
        { "title" : "Report Name",
         "data" : "title"
        },
        { "title" : "Date Range",
          "data" : "reportDateRangeMilliseconds",
          "render" : {
             "display" : "DateRange"
          }
        }
    ]
})

但它返回错误：

DataTables警告：table id = reportList - 请求的未知参数＆＃39; reportDateRangeMilliseconds＆＃39;对于第0行。有关的更多信息此错误，请参阅http://datatables.net/tn/4

请参阅http://jsfiddle.net/scottglew/pmpj9uyb/1/

我也尝试过：

$('#reportList').dataTable({
    "data" : reportData,    
    "columns" : [
        { "title" : "Report Name",
         "data" : "title"
        },
        { "title" : "Date Range",
          "data" : {
              "sort" : "reportDateRangeMilliseconds",
              "display" : "DateRange"
          }
        }
    ]
})

哪个不会返回错误，但也没有使用毫秒值正确排序。见http://jsfiddle.net/scottglew/jrnou3p3/2/

我也尝试了一系列其他组合，但没有任何乐趣。谁能救我的理智？

Answer 1

我终于找到了一种方法来实现这一点，通过为毫秒值创建另一个隐藏列，然后我指出了＆＃39;日期范围＆＃39;的orderData属性。列到隐藏列。

$('#reportList').dataTable({
    "data" : reportData,    
    "columns" : [
        { "title" : "Report Name",
         "data" : "title"
        },
        { "title" : "Range In milliseconds",
          "data" : "reportDateRangeMilliseconds",
          "visible" : false
        },
        { "title" : "Date Range",
          "data" : "DateRange",
          "orderData" : [1]
        },
    ]
});

请参阅http://jsfiddle.net/vxshL3ju/1/

但这并没有打败新的＆＃34;排序＆＃34;和＆＃34;显示＆＃34; DataTables 1.10中引入的属性？

Answer 2

对于我在Rails应用程序中的haml文件中的需求，这是我通过隐藏距离列在人类可读距离（靠近时的英尺/米，以及> 1英里时的英里/公里）上查看和排序的方式：

$('.water_supply table').DataTable({
  "order": [[3, "asc"]],
  "paging": true,
  "pageLength": 20,
  // Have the visible distance column (2) sort actually use the
  // (hidden) monotonic distance_in_miles column data (3rd)
  "columnDefs": [
      { "targets": [2],
        "visible": true,
        "orderData": [3]
      },
      { "targets": [3],
        "visible": false,
      }
    ]
});

如何在DataTables 1.10中使用不同的值进行排序和显示

2 个答案: