如何使用不同的数据进行排序

时间:2022-01-03 12:55:38

I'm using jQuery DataTables 1.10.4 to render a table each of whose rows has bits of information about a file.

我正在使用jQuery DataTables 1.10.4来呈现一个表,每个表的行都包含有关文件的信息。

A column in this table shows file sizes. When rendered, I want the column to read NNN KB (with a "KB" suffix). I also want the user to be able to numeric sort on the file size column.

此表中的列显示文件大小。渲染时,我希望列读取NNN KB(后缀为“KB”)。我还希望用户能够对文件大小列进行数字排序。

However, while my files data array just has numbers indicating the size of the file in bytes, the sort functionality seems to use the rendered value of the string, and I get a string sort, not a numeric one.

但是,虽然我的文件数据数组只有数字表示文件的大小(以字节为单位),但排序功能似乎使用字符串的呈现值,我得到一个字符串排序,而不是数字排序。

Is there an easy way to declare the type of the column such that the sort is numeric? I.e. for sorting, I'd like jQuery DataTables to use the values in the files array.

是否有一种简单的方法来声明列的类型,使得排序是数字?即为了排序,我希望jQuery DataTables使用files数组中的值。

If this can't just be declared with a columnDefs specification, what is the easiest sort plugin or function to use?

如果这不能仅使用columnDefs规范声明,那么最简单的排序插件或函数是什么?

Here's what I have so far.

这是我到目前为止所拥有的。

var files = {['name','dir',10240], .... }

var sortable_size = function(data, type, full, meta) {
    return Math.floor(full[2]/1024) + " KB";
};

$('#files').dataTable({
   data: files,
   pagingType: 'simple',
   columnDefs: [
      { targets:0, render:clickable_message },
      { targets:3, render:clickable_attachment },
      { targets:2, render:sortable_size, width:'100px', type:'num' }
   ], 
   // no width for col 0 here because it causes linewrap in data 
   // and size fields (attachment name can be fairly wide as well)
   order:[[1, 'asc']], // col 1 (date), ascending
   fnInitComplete: function() { 
      $('#attachments').fadeIn(); 
   }
});

2 个解决方案

#1


2  

Th solution is simple, when the data is displayed (type === 'display'), return formatted string, otherwise return the data to be sorted. From the manual:

解决方案很简单,当显示数据时(类型==='显示'),返回格式化字符串,否则返回要排序的数据。从手册:

The type call data requested - this will be 'filter', 'display', 'type' or 'sort'.

请求的类型呼叫数据 - 这将是'过滤','显示','类型'或'排序'。

var sortable_size = function(data, type, full, meta) {
    if(type === 'display'){
       return Math.floor(full[2]/1024) + " KB";
    } esle {
       return data;
    }
};

See columns.render for more information.

有关更多信息,请参见columns.render。

If you wouldn't have file size stored in bytes, the solution would be to use File size sorting plug-in.

如果您没有以字节为单位存储文件大小,解决方案是使用文件大小排序插件。

#2


0  

Solved it with my own sort type:

用我自己的排序类型解决了它:

 $.fn.dataTableExt.oSort['sort-kb-asc']  = function(x,y) {
        console.log('x =' + x + ' y = ' + y);
        x = parseInt(x.substring(0, x.indexOf(' KB')));
        y = parseInt(y.substring(0, y.indexOf(' KB')));
        console.log('x =' + x + ' y = ' + y);
        return ((x < y) ? -1 : ((x > y) ?  1 : 0));
    };

    $.fn.dataTableExt.oSort['sort-kb-desc']  = function(x,y) { return -1 * $.fn.dataTableExt.oSort['sort-kb-asc'](x,y); }

and in my columnDefs invocation:

在我的columnDefs调用中:

{targets:2,render:sortable_size,width:'100px',type:'sort-kb',className: "dt-right"},

#1


2  

Th solution is simple, when the data is displayed (type === 'display'), return formatted string, otherwise return the data to be sorted. From the manual:

解决方案很简单,当显示数据时(类型==='显示'),返回格式化字符串,否则返回要排序的数据。从手册:

The type call data requested - this will be 'filter', 'display', 'type' or 'sort'.

请求的类型呼叫数据 - 这将是'过滤','显示','类型'或'排序'。

var sortable_size = function(data, type, full, meta) {
    if(type === 'display'){
       return Math.floor(full[2]/1024) + " KB";
    } esle {
       return data;
    }
};

See columns.render for more information.

有关更多信息,请参见columns.render。

If you wouldn't have file size stored in bytes, the solution would be to use File size sorting plug-in.

如果您没有以字节为单位存储文件大小,解决方案是使用文件大小排序插件。

#2


0  

Solved it with my own sort type:

用我自己的排序类型解决了它:

 $.fn.dataTableExt.oSort['sort-kb-asc']  = function(x,y) {
        console.log('x =' + x + ' y = ' + y);
        x = parseInt(x.substring(0, x.indexOf(' KB')));
        y = parseInt(y.substring(0, y.indexOf(' KB')));
        console.log('x =' + x + ' y = ' + y);
        return ((x < y) ? -1 : ((x > y) ?  1 : 0));
    };

    $.fn.dataTableExt.oSort['sort-kb-desc']  = function(x,y) { return -1 * $.fn.dataTableExt.oSort['sort-kb-asc'](x,y); }

and in my columnDefs invocation:

在我的columnDefs调用中:

{targets:2,render:sortable_size,width:'100px',type:'sort-kb',className: "dt-right"},