1

<div>各セルにデータを取得するために使用しています。

私は最近、それを見つけてjQuery tablesorter実装しようとしましたが、うまくいきませんでした。

コードの先頭にこれがあります：

$(document).ready(function() 
{ 
    $("#data_fm_op").tablesorter({ sortList: [[0, 0], [1, 0]] }); 
});

そして、次のようなエラーが表示されます：

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1;
Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR
3.5.30729; .NET4.0C; .NET4.0E; InfoPath.3; MS-RTC LM 8) Timestamp: Mon, 24 Jun 2013 16:41:24 UTC

Message: 'config.parsers' is null or not an object Line: 600 Char: 21
Code: 0 URI: file:jquery.tablesorter.js

次の関数を使用して各セルを作成しています。

function addRow(tableID, nbrColumn) 
{
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    for(i = 0; i < nbrColumn; i++)
    {
        var cell = row.insertCell(i);
        cell.contentEditable = true;
        var element = document.createElement("div");
        element.className = "boxes";
        element.id = tableID + n + "" + i;
        element.contentEditable = true;
        element.style.display = "inline";
        cell.id = tableID + n + "" + i + "cell";
        cell.appendChild(element);
    }
    n++;    
}

この関数は、データベースからデータを読み取るときに新しい行を作成するループで使用されるため、新しい行が作成され、すべてのデータがそれぞれの<div>.

なぜこのエラーが発生するのですか? どうすればこれを修正できますか？

どんな助けでも大歓迎です！

アップデート

テーブルをロードするコードは次のとおりです。

function loadTables()
{
    loadTbl('fm_op', 'data_fm_op', 15);
    alert("sorter() WILL LOAD NOW");
    $(function sorter() 
    { 
        $("#data_fm_op").trigger("update").trigger("sorton", [[0, 1], [1, 0]]);
    }); 
}

この関数は、<body>タグの onload で呼び出されます

アップデート

<TABLE id="data_fm_op" class="table" >
        <thead><tr class="ui-widget-header">
            <th><div id="data_fm_op000" type="text" style="color:#333;text-align:center;">T<span class="ui-icon ui-icon-carat-1-s"></span></div></th>
            <th style="display:none"><div id="data_fm_op001" type="text" style="color:#333;text-align:center">Status</div></th>
            <th><div id="data_fm_op002" type="text" style="color:#333;text-align:center">ID</div></th>
            <th><div id="data_fm_op003" type="text" style="color:#333;text-align:center">System</div></th>
            <th><div id="data_fm_op004" type="text" style="color:#333;text-align:center">Desc</div></th>
            <th><div id="data_fm_op005" type="text" style="color:#333;text-align:center" >Resp</div></th>
            <th><div id="data_fm_op006" type="text" style="color:#333;text-align:center">Hrs</div></th>
            <th><div id="data_fm_op007" type="text" style="color:#333;text-align:center" >Ingr</div></th>
            <th style="display:none"><div id="data_fm_op008" type="text" style="color:#333;text-align:center" >Ini Real</div></th>
            <th><div id="data_fm_op009" type="text" style="color:#333;text-align:center" >Ini</div></th>
            <th style="display:none"><div id="data_fm_op0010" type="text" style="color:#333;text-align:center" >Beta Real</div></th>
            <th><div id="data_fm_op0011" type="text" style="color:#333;text-align:center" >Beta</div></th>
            <th style="display:none"><div id="data_fm_op0012" type="text" style="color:#333;text-align:center" >Prod Real</div></th>
            <th><div id="data_fm_op0013" type="text" style="color:#333;text-align:center" >Prod</div></th>
            <th><div id="data_fm_op0014" type="text" style="color:#333;text-align:center" >Obs</div></th>
        </tr></thead>
        <tbody></tbody>
    </TABLE>
4

2 に答える 2

1

コメントのフォーマットができないので回答として投稿しますが、うまくいかない場合は削除します。

loadTbl 関数の直後に更新自体を呼び出してみましたか (以下を参照)。

function loadTables(){
    loadTbl('fm_op','data_fm_op',15);
    alert("sorter() WILL LOAD NOW");
    $("#data_fm_op").trigger("update").trigger("sorton",[[0,1], [1,0]]);
}

私はあなたのためにFiddleを作成しましたが、それがあなたの目的であるかどうかはわかりません。

于 2013-06-26T19:46:55.033 に答える
0

テーブル行を動的に作成しているため、行を追加した後に「update」イベントと「sorton」イベントをトリガーして、このように機能させる必要があります。

  $("#data_fm_op").trigger("update").trigger("sorton",[[0,0], [1,0]]);

詳細については、これをチェックしてくださいhttp://tablesorter.com/docs/example-ajax.html

于 2013-06-26T17:22:33.987 に答える