2009-07-07 81 views
20

MVC .NET Appでテーブルソーのプラグインを使用してテーブルをソートしています。私の列のほとんどは文字列であり、私はそれらに問題はありません。数字のものでもありません。私のdatetimeカラムも、文字列であるかのようにソートされています。これらは、01/04/2009、02/02/2009、03/08/2009などのようにソートされています。そのビューのモデルからデータを取得します。jquery tablesorterで日付をソートする際の問題

マイコールがデフォルトです:

$("#table").tablesorter(); 

私は運とDATEFORMATを指定してみました:私は手動でランダムな日付で静的テーブルを入力すると

$("#table").tablesorter({ 
      dateFormat: 'dd/mm/yyyy'}); 

奇妙なことが起こります。それはソートされます!しかし、私のデータはDB呼び出しから来て、モデルに入れられます。それから、それを繰り返し作成し、データと共にtrを書きます。

ありがとうございます。

編集:それは私がTR年代を作成する方法に関連したものになるだろうか?

<% foreach (var item in Model) { %> 
<tr> 
<td> 
<%= Html.Encode(item.date) %> 
</td> 
<td>...</td> 
<td>...</td> 
<td>...</td> 
</tr> 
<% } %> 
+0

yyyy-mm-ddで日付を書式設定することはできますか? – ScottE

+0

それは私の国のロケール(スペイン)になければなりません。 :( –

答えて

26

日付列にTablesorterパーサを追加してみてください。 Tablesorterには、shortDate、usLongDate、およびisoDateのパーサが付属しています。

$("#table").tablesorter({ 
    headers: { colNum: { sorter: 'shortDate'} } 
}); 

ここで、colNumは日付の列です。私がtablesorterサイトで見つけることができる唯一の例はhereです。これは、tablesorterが数字を間違ってソートしている場合にも機能します。 %、IPアドレスなどのパーサーもあります。ソースコードの最後を見て、そこにリストされます。

編集:ソースコードを見て 、DATEFORMATオプションは、 "私たち"、 "英国"、 "DD/MM/YY" または "DD-MM-YY" を探しているように見えます。 "英"を試してみるとどうなりますか?

+0

私はshorDateパーサaswellを試していないが、言及するのを忘れてしまったん運のいずれか:(私は他の日付パーサで試してみて、あなたが知ってもらおう働いたおかげ –

+12

を 次のように私は電話を置く:。。! を$( "#テーブル")。tablesorter({dateFormat: 'uk'}); 私はMVC生成時(この回避策を見つける必要はありません)ではなく、プレーンHTMLでテーブルを書くときに、デフォルトの呼び出しで意図したとおりに動作するのか疑問に思っています。 ありがとう! –

+1

再度StackOverflowが正解の唯一の場所であるように見えます! dateFormat: 'dd/mm/yyyy'はそうではありませんが、 'uk'も私のために働きます。 –

16

私は同じ問題を抱えて、私は日時と呼ばれるカスタム・パーサーを追加しました:

$.tablesorter.addParser({ 
    id: "datetime", 
    is: function(s) { 
     return false; 
    }, 
    format: function(s,table) { 
     s = s.replace(/\-/g,"/"); 
     s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1"); 
     return $.tablesorter.formatFloat(new Date(s).getTime()); 
    }, 
    type: "numeric" 
}); 

ゲイブGはこれを割り当てるために例えば(暴露として次に、あなただけの、あなたがしたい列にそのフォーマットを適用する必要がありますあなたが次のことを行う必要があり、最初の列にソーター:

$("#mytable").tablesorter( 
    { dateFormat: 'dd/mm/yyyy', 
     headers: 
      { 
       0:{sorter:'datetime'} 
      } 
    }); 
+0

これは素晴らしいです。おかげ –

2

jqueryのtablesorterプラグインのアップデートが存在する

あなたAPPLICのロケールによります。この更新プログラムで日付を並べ替えることができます。

次のリンクをクリックして、tablesorterの更新を表示することができます。

http://tablesorter.openwerk.de/

7

また、数値形式(YYYYMMDD)にあなたの日前に隠されたspanタグを追加することができます。このテキストは最初にソートに使用されますが、視覚に隠され、必要な書式のみが表示されます。

<td><span style="display:none">20130923</span>23 September 2013</td>  
+1

むしろ子要素としてスパンを持つよりも、テーブルのセルに 'データ - *'属性を使用する方が論理的だろう。 –

0

簡単な方法の使用:compsmartは、実際の日付の前にいくつかの隠しテキストを追加し、言ったように

dateFormat:'mm/dd/yyyy hh:mm:ss' 
0

私のための最も簡単な解決正直に言うが、でした。

  • DATEFORMAT:「英国は多分、私のために働いていなかった私の日付形式は再び異なるため
  • http://tablesorter.openwerk.de/は、CSSを変更する必要、最初に私はなぜ理解していないと第二の努力はより大きい簡単に日付の前に隠れたテキストを追加する。

私はcompsmartのKISSソリューションが好きです!日付書式を設定し

0

http://mottie.github.io/tablesorter/docs/

。利用可能なオプションは次のとおりです。 (修正版v2.0.23)。

  • "MMDDYYYY"(デフォルト)
  • "DDMMYYYY"
  • は "YYYYMMDD" 以前のバージョンで

、このオプションは、 "私たち"、 "英国" または「DD /とした mm/yy "である。このオプションは、必要な日付形式に合わせて変更されました。それは4桁の年だけで動作します!

ソーターは "shortDate"に設定し、日付形式は "dateFormat"オプションで設定するか、 "headers"オプション内の特定の列に設定する必要があります。デモページを参照してください。 「

  • jQueryのデータのデータDATEFORMAT =:

    $(function(){ 
        $("table").tablesorter({ 
    
        dateFormat : "mmddyyyy", // default date format 
    
        // or to change the format for specific columns, 
        // add the dateFormat to the headers option: 
        headers: { 
         0: { sorter: "shortDate" }, // "shortDate" with the default dateFormat above 
         1: { sorter: "shortDate", dateFormat: "ddmmyyyy" }, // day first format 
         2: { sorter: "shortDate", dateFormat: "yyyymmdd" } // year first format 
        } 
    
        }); 
    }); 
    

    個々の列は、優先順位(修正v2.3.1)の順に設定し、(それらはすべて同じことを行う)以下を追加することによって変更することができますmmddyyyy "となります。

  • metadata class = "{dateFormat: 'mmddyyyy'}"です。これには、メタデータプラグインが必要です。
  • ヘッダーオプションヘッダー:{0:{dateFormat: 'mmddyyyy'}}。
  • ヘッダークラ​​ス名class = "dateFormat-mmddyyyy" 全体のdateFormatオプション。私の場合は

私はバージョンの

$("#myTable").tablesorter({dateFormat: "uk"}) 

を使用していました。

関連する問題