web-dev-qa-db-ja.com

Jquery Tablesorterでの日付の並べ替えの問題

2009-12-17 23:59:59.0のような列を持つテーブルをソートしようとしています。以下を使用してソートを適用しています

$(document).ready(function() 
        { 
            $("#dataTable").tablesorter();  
        } 
    );

ただし、yyyy-mm-dd形式の日付では機能しません。このフォーマットを並べ替えに適用するにはどうすればよいですか？

jquerytablesorter
24
CFUser

正しいことは、このカスタム形式に独自のパーサーを追加することです。

これをチェックして、それがどのように機能するかを理解してください。

jQuery Tablesorter：独自のパーサーを追加

次に、テーブルソーターのソースを調べます（uslongdate、shortdateを検索し、日付形式のパーサーがtablesorterによって内部でどのように実行されるかを確認します。次に、特定の日付形式の類似のパーサーを自分で作成します。

jquery.tablesorter.js

これはあなたの好みに合うはずです

ts.addParser({
    id: "customDate",
    is: function(s) {
        //return false;
        //use the above line if you don't want table sorter to auto detected this parser
        //else use the below line.
        //attention: doesn't check for invalid stuff
        //2009-77-77 77:77:77.0 would also be matched
        //if that doesn't suit you alter the regex to be more restrictive
        return /\d{1,4}-\d{1,2}-\d{1,2} \d{1,2}:\d{1,2}:\d{1,2}\.\d+/.test(s);
    },
    format: function(s) {
        s = s.replace(/\-/g," ");
        s = s.replace(/:/g," ");
        s = s.replace(/\./g," ");
        s = s.split(" ");
        return $.tablesorter.formatFloat(new Date(s[0], s[1]-1, s[2], s[3], s[4], s[5]).getTime()+parseInt(s[6]));
    },
    type: "numeric"
});

これを、この形式の列に適用するだけです（たとえば、カスタム日付が存在する列が列番号7にあると仮定します（列の配列はゼロベースであるため、6は列7を意味します）。

$(function() {
    $("table").tablesorter({
        headers: {
            6: { sorter:'customDate' }
        }
    });
});
36
jitter

UK/European date format dd/mm/yyyy by：

$("#tableName").tablesorter({dateFormat: "uk"});
36
Peter Dolinaj

最新バージョン2.18.4では、このように簡単に行うことができます。デフォルトの日付形式を指定し、特定の列セットで列の日付形式を設定するだけで、「shortDate」ソーターでのみ機能します。

$('YourTable').tablesorter(
            {
                dateFormat:'mmddYYYY',
                headers: {
                    0: { sorter: false },
                    1: { sorter: true},
                    2: { sorter: true },
                    3: { sorter: true },
                    4: { sorter: "shortDate", dateFormat: "ddmmyyyy" },
                    5: { sorter: true },
                    6: { sorter: false },
                    7: { sorter: false },
                    8: { sorter: false },
                    9: { sorter: false },
                    10: { sorter: false },
                    11: { sorter: false }

                }
            });
8
V.B

mm/dd/yyyy hh：mmのような日付/時刻形式を使用している場合は、以下を使用してください

$.tablesorter.addParser({ 
        id: "customDate",
        is: function(s) {
            //return false;
            //use the above line if you don't want table sorter to auto detected this parser                        
            //21/04/2010 03:54 is the used date/time format 
            return /\d{1,2}\/\d{1,2}\/\d{1,4} \d{1,2}:\d{1,2}/.test(s);
        },
        format: function(s) {
            s = s.replace(/\-/g," ");
            s = s.replace(/:/g," ");
            s = s.replace(/\./g," ");
            s = s.replace(/\//g," ");
            s = s.split(" ");                       
            return $.tablesorter.formatFloat(new Date(s[2], s[1]-1, s[0], s[3], s[4]).getTime());                                         
        },
        type: "numeric"} );
6
Aleem Latif

dateFormat： "mmddyyyy"、//デフォルトの日付フォーマットを設定します

example-option-date-format

0
b3wii

新しいパーサーを作成する必要はありません変更をほとんど加えずに既存のパーサーを使用します。

1。以下のスクリプトが表示されるJqueryプラグインjsを開きます。今度は、最後のelseの日付形式（希望）を変更します。 -dd」。

    ts.addParser({
    id: "shortDate",
    is: function (s) {
        return /\d{1,2}[\/\-]\d{1,2}[\/\-]\d{2,4}/.test(s);
    }, format: function (s, table) {
        var c = table.config;
        s = s.replace(/\-/g, "/");
        if (c.dateFormat == "us") {
            // reformat the string in ISO format
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$1/$2");
        } else if (c.dateFormat == "uk") {
            // reformat the string in ISO format
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
        } else if (c.dateFormat == "yy-mm-dd" || c.dateFormat == "dd-mm-yy") {
            s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{2})/, "$1/$2/$3");
        }
        return $.tablesorter.formatFloat(new Date(s).getTime());
    }, type: "numeric"
});



2。次に、ジッターによって言及された最後のステップに従いますが、ほとんど変更しません。

$(function() {
$("table").tablesorter({
    headers: {
        6: { sorter:'shortDate' }
    }
});
});
0
RollerCosta