1

カスタム形式のカスタム テーブルがあるため、既存のテーブル ソート プラグインを適用することはまったく不可能です。

ほとんどのプラグインは、標準の HTML テーブルでこれをどのように達成しますか。

基本的な簡単な箇条書きの説明で十分です。それがどのように機能するかを知りたいだけです。

4

4 に答える 4

1

テーブルを再構築する必要があります。たとえば、すべてのtr要素を抽出し.sort、行の配列に対して a を実行し、目的の列を検査するカスタムの並べ替え関数を渡し、並べ替えられた順序で行を再挿入します。

カスタム並べ替え関数は、比較する値を抽出するだけでよく、それらが等しい場合は 0 を返し、最初の値が大きい場合は 1 を返し、2 番目の値が大きい場合は -1 を返します。

myArray.sort(function(a, b) {
    var a = parseInt($(a).find('td:first').text(), 10);
    var b = parseInt($(b).find('td:first').text(), 10);

    if(a == b) return 0;
    return a>b ? 1 : -1;
});

デモ

ページ分割されたデータを使用している場合、もちろん、クライアントに送信されたデータのみを並べ替えることができることに注意してください。これらのシナリオでは、AJAX 要求をサーバーに送信してテーブルにデータを入力し、並べ替えられたデータを要求し、その応答に基づいてテーブルを再入力する方が良いでしょう。

于 2012-06-21T10:31:43.330 に答える
1

まあ、そのようなプラグインのソースを見たことはありませんが、そのように機能すると思います。

HTML テーブルは一種のマトリックスであり、おそらく次のように表すことができます。

var table = [
 ['Id', 'Name',    'Phone number',   'Email'],
 [2,    'Boris',   '+33686868686',   'ahah@example.com'],
 [1,    'You',      null,            'foo@bar.baz'],
 [5,    'Anyone',   null,            null]
];

このような行列を使用すると、次のように並べ替えることができます。

table.sort(function(a, b) {
   return ((a[0] == b[0]) ? 0 : ((a[0] > b[0]) ? 1 : -1));
});

結果:

 ['Id', 'Name',    'Phone number',   'Email'],
 [1,    'You',      null,            'foo@bar.baz'],
 [2,    'Boris',   '+33686868686',   'ahah@example.com'],
 [5,    'Anyone',   null,            null]

次に、並べ替えられた配列を使用して行を移動して並べ替えます。

明らかに、より複雑な並べ替えアルゴリズムが必要になりますが、基本的にはこのように行われると思います。

于 2012-06-21T10:42:08.593 に答える
0

たとえば、jQuery の「tablesorter」プラグインは非常に柔軟です: http://tablesorter.com/docs/

また、完全にカスタムのソート キーを使用できるようにする「sorttable」プラグイン (jQuery なし) を使用して、過去に大きな成功を収めたこともあります。コード/ブラウザ/ソート可能/

于 2012-06-21T10:36:10.093 に答える
-1

とても簡単です。DOM 内で要素を移動できます。シンプルで、行から配列にデータを取得し、並べ替えてテーブルを再構築できます。

于 2012-06-21T10:34:48.460 に答える