javascript - HTML5/Javascript 数据表顺序/列排序

Question

我目前正在使用来自 http://datatables.net 的数据表.我有许多包含“未知”数据的列(即无法预先设置内容类型)

在使用数据表之前，这只是一个标准的简单表，其中使用 ASP.NET/C#/LINQ orderby(顺序排序)在服务器端完成排序，这几乎适用于任何情况。

现在，数据表的排序大多是错误的。尤其是数字以及字符串和数字的混合是错误的。

我的错误案例:

1. 空字符串总是排在最前面，我希望它们排在最后。不过可以忍受这个。
2. 数字/货币的顺序应该正确。目前下单是这样的500,12400,001.123,00223.441,00

我对这个数据表/JavaScript 世界相当陌生。对于错误情况，我已经添加了我能想到的所有插件，并且我已经对它们进行了所有测试，但没有成功地正确排序列表。

我认为我想要的排序是有序的(比如 ASCII 二进制)，如果我能理解如何在 JS 中执行以下操作，我可以通过实现自己的排序函数来生活:

int c = String.Compare(a, b, StringComparison.Ordinal);

Answer 1

不久前遇到了与数据表类似的挑战。这是与日期、格式化数字以及德语中的特殊字符有关的。你的名字听起来像是来自斯堪的纳维亚半岛；我猜也可能与你有关......

您需要以下数据表插件来完成所有这些:

这个用于日期时间排序:https://datatables.net/plug-ins/sorting/datetime-moment它还需要我强烈推荐的 moment.js。 https://momentjs.com/

当使用 ä、ö ü 等特殊字符时，这个用于国际排序。 https://datatables.net/plug-ins/sorting/intl

这个用于格式化数字排序: https://datatables.net/plug-ins/sorting/formatted-numbers

以下示例是关于根据用户语言自动检测各个字段的。

实现示例:

所以这是关于格式化数字的。英文格式为 1,000,000.99。德语格式为 1.000.000,99。它还会处理空白字段。

//sorting of formatted numbers in English and German format
$.extend( $.fn.dataTable.ext.type.order, { 
    "formatted-num-pre": function ( a ) {
        if (lang == 'de') {
            a = a.toString().replace( /[\.]/g, "" );
            a = a.toString().replace( /[\,]/g, "." );
        } else {
            a = a.toString().replace( /[\,]/g, "" );
        }
        a = a.toString().replace( /[^\d.-]/g, "" );
        a = parseFloat(a);
        if ( ! isNaN(a) ) {
            return a;
        } else {
//14 digit negative number to make sure empty cells always stay at the bottom / top
            return -99999999999999;
        }
    },
    "formatted-num-asc": function ( a, b ) {
            return a - b;
    },
    "formatted-num-desc": function ( a, b ) {
            return b - a;
    }
} );

这是关于国际排序的:

//sorting:
//Use the phonebook variant of the German sort order, 
//which expands umlauted vowels to character pairs: ä → ae, ö → oe, ü → ue.
if (lang === 'de') {
    $.fn.dataTable.ext.order.intl("de-DE-u-co-phonebk");
} else {
    $.fn.dataTable.ext.order.intl("en-GB");
}

最后是关于日期排序的:

//should be positioned after the number formatting to make sure
//date columns don't accidentally are assigned formatted-num
//set parms for date sorting using moment.js
$.fn.dataTable.moment( 'L', momentLocale );

我示例中的变量 momentLocale 是“de”或“en-gb”。相应的日期格式为 10.11.2018(德语)或 10/11/2018(英语 UK)。 (与我认为要求 momentLocale 为“en”的美国格式的 11/10/2018 相反)。