使用jQuery DataTables的自定义排序持续时间 [英] Custom sort durations using jQuery DataTables

问题描述

我需要在jQuery数据表中对列进行排序。我尝试使用时刻插件没有成功。

列包含通话持续时间，但并不总是在那里，所以我们使用 N / A 。列数据如下所示：

  2m 45s 
 1m 32s 
 N / A 
 45s 
 1m 
  

我需要能够使用 N / A 价值小于 0 ，其余的按逻辑顺序

我使用jQuery DataTables 1.10.6，时刻2.9.0我确实有所有的数据表插件。我在表的标题中使用 data-stype 是 th 。我也使用no config datatable init看起来像这样

  //创建DataTables用户
 table = $（'＃总结表'）DataTable（{
'language'：{url：paths.lang _ {{LaravelLocalization :: getCurrentLocale（）}}}，
'respond'：
 { 
'details'：
 {
'type'：'inline'
} 
}，
'order'：[[（nbCat + 5） ，'desc']]，
'dom'：'<row<col-sm-12 before-table 
<table_controls>>>< row<col-sm-12t><row<col-sm-12ipl>>'，
'lengthMenu'：[[20， 100，-1]，[20，50，100，transAll]]，
}）; 
  

解决方案

解决方案

使用以下代码：

  jQuery.extend（jQuery.fn.dataTableExt.oSort，{
duration-pre：function（s）{
 var duration; 
 
s = s.toLowerCase（）; 
 
 if（s ==='n / a'）{
 duration = -1; 
 
} else {
d = s.match（/（？（\d +）m）？\s * （？（\d +）s）？/）; 
 duration = parseInt（d [1]？d [1]：0）* 60 + parseInt（d [2]？d [2] ）; 
} 
 
 return duration; 
} 
}）; 
 
 $（document）.ready（function（）{
 var table = $（'＃summary-table'）。DataTable（{
 columnDefs：[
 {targets：0，type：'duration'} 
] 
}）; 
}）; 
  

在 0 > targets：0 到包含持续时间的列的索引。为了简单起见，我省略了其他表格选项。

演示

请参阅这个jsFiddle 进行代码和演示。

I need to sort a column in jQuery DataTables. I tried using the moment plugin without success.

The column contains call duration but it's not always there so we use N/A for those. Column data looks like:

2m 45s
1m 32s
N/A
45s
1m

I need to be able to sort these with the N/A valuing less than 0 and the rest to be in the logical order

I use jQuery DataTables 1.10.6, moment 2.9.0 and I do have all the datatables plugins. I use data-stype is th in the header of my table. I also use the no config datatable init looks like that

// Create DataTables User
    table = $('#summary-table').DataTable({
        'language'  : { "url": paths.lang_{{LaravelLocalization::getCurrentLocale()}} },
        'responsive':
        {
            'details':
            {
                'type': 'inline'
            }
        },
        'order': [[(nbCat + 5), 'desc']],
        'dom': '<"row"<"col-sm-12 before-table
               "<"table_controls">>r><"row"<"col-sm-12"t>><"row"<"col-sm-12"ipl>>',
        'lengthMenu': [[20, 50, 100, -1], [20, 50, 100, transAll]],
    });

解决方案

SOLUTION

Use the code below:

jQuery.extend(jQuery.fn.dataTableExt.oSort, {
    "duration-pre": function (s) {        
        var duration;

        s = s.toLowerCase();

        if(s === 'n/a'){ 
            duration = -1;

        } else {            
            d = s.match(/(?:(\d+)m)?\s*(?:(\d+)s)?/);
            duration = parseInt(d[1] ? d[1] : 0) * 60 + parseInt(d[2] ? d[2] : 0);
        }

        return duration;
    }
});

$(document).ready(function (){
    var table = $('#summary-table').DataTable({
       columnDefs: [
           { targets: 0, type: 'duration' }
       ]         
    });
});

Change 0 in targets: 0 to index of the column containing the duration. I omitted other table options for the sake of simplicity.

DEMO

See this jsFiddle for code and demonstration.

这篇关于使用jQuery DataTables的自定义排序持续时间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！