Tablesorter 2.0.3 Colspanの問題

Question

私はテーブルター2.0.3を使用したいくつかの問題です。

最初の問題は、テーブルにコルスパンを設定したときです。基本的に、私がこれを以下に行うとき、それはそれぞれの列を並べ替えません。

<table> 
<thead> 
        <th colspan="3"></th>  
        <th>Four</th> 
        <th>Five</th>
        <th>Six</th>
        <th>Seven</th>  
</thead> 
<tbody> 
<tr> 
        <td>1</td> 
        <td>2</td> 
        <td>3</td> 
        <td>4</td>
        <td>5</td> 
        <td>6</td>
        <td>7</td>
</tr>  
</tbody> 
</table> 

私が抱えている2番目の問題は、Tablesortor.jsでSortInitialOrder（ "DESC"または "ASC"）を何を設定しても、クリックしたときにソートを昇順または下降することには何の効果もないということです。

誰かを手伝ってくれませんか？

Answer 1

問題を解決するには、データコルへのヘッダーの独自のマッピングを作成できます。これが私が望んでいた方法で機能を取得するために私がしたことです。

Tablesortor.jsに次の方法を追加しました。

function findInMap(map, index, reverse) {
    for(var i = 0; i < map.length; ++i) {
        if(map[i][reverse ? 1 : 0] == index) return map[i][reverse ? 0 : 1];
    }

    return index;
}

また、以下を追加しました this.defaults

customMap: []

次の方法を変更します。

function setHeadersCss(table,$headers, list, css) {
    $headers.removeClass(css[0]).removeClass(css[1]);

    var h = [];
    $headers.each(function(offset) {
        if(!this.sortDisabled) {
            h[this.column] = $(this);                   
        }
    });

    var l = list.length; 

    for(var i=0; i < l; i++) {
        var header = list[i];
        var headerIndex = findInMap(table.config.customMap, header[0], true);
        h[headerIndex].addClass(css[header[1]]);
    }
}

最後になりましたが、以下を追加/変更します $headers.click(function(e) {

追加：

var ia = findInMap(config.customMap, i, false);

変化する：config.sortList.push([i,this.order]); に config.sortList.push([ia,this.order]);

あなたが開始するとき、テーブルターはaを渡します customMap[[header_col_id, data_col_id]] あなたの場合、それは次のとおりです。

customMap[
    [2, 4],
    [3, 5],
    ...
]

Answer 2

3つの列にまたがるヘッダーをクリックした場合、何が起こると思いますか？どの列が並べ替えると思いますか？一般に、テーブルターが動作するには、各列に1つのヘッダーが必要です。

sortInitialOrder TablesorterのWebページには言及されていないようですが、コードには存在します。私は以前にこれを使用しただけです：

sortList: [[5, 0]]

最初は5列目を使用して上昇をソートします。

Answer 3

私は問題を解決しました。また、テーブルに昇順のみを並べ替えることだけを望んでいたので、536行を修正しました。 this.order = this.count++ % 0; それは私が望むようにそれを並べ替えるようにします。

コルスパンに関連して、私はそれぞれの列を並べ替えるために空白を持っていることに頼らなければなりませんでした。正しいマークアップではないかもしれませんが、これを修正する他の方法はわかりません。

Answer 4

テーブル型コード自体に次のパッチを使用して、同様の問題を自分で解決しました。

Index: jquery.tablesorter.js
===================================================================
--- jquery.tablesorter.js   (.../original)  (revision x)
+++ jquery.tablesorter.js   (.../mine)  (revision y)
@@ -278,7 +278,10 @@
                     cache.row.push(c);

                     for (var j = 0; j < totalCells; ++j) {
-                        cols.push(parsers[j].format(getElementText(table.config, c[0].cells[j]), table, c[0].cells[j]));
+                        var cSpan = c[0].cells[j].colSpan || 1;
+                        while (cSpan--) {
+                            cols.push(parsers[j].format(getElementText(table.config, c[0].cells[j]), table, c[0].cells[j]));
+                        }
                 }

私の問題はすべて逆転しました。 1つのコルスパンセルにまたがる2つの列がありました。これにより、スパンされた列がまだソート可能である後にすべての列が修正されます。