jQuery tablesorter sorting not working

私はcsvファイルからテーブルを動的に生成するためにjQuery tablesorterプラグインを使用しており、その部分は正常に動作しています。しかし、私は、コンソールに放火犯のレポート、テーブルヘッダをクリックすることで、テーブルを並べ替えるには、この問題を試みるたび：jQuery tablesorter sorting not working

parsers is undefined 
return parsers[i].type;\n

当初、私はこの問題は非常に、文書をロードした後、準備されていないテーブルによって引き起こされていたにもかかわらず私はテーブルをcsvファイルからレンダリングした後、手動でtablesorter（）を呼び出すことで修正しました。しかし、これは問題を解決しませんでした。

また、テーブルの最後には、表の末尾に文字がgray areasで文字化けして表示されます。私はこれが上記のエラーに関連していると思います。あなたの助けを事前に

<html> 

<head> 
    <link rel="stylesheet" href="blue/style.css" type="text/css" /> 

    <script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
    <script type="text/javascript" src="jquery.tablesorter.js"></script> 
    <script type="text/javascript" src="jquery.csv.js"></script> 
    <script type="text/javascript" id="js"> 
    function sortThis() { 
     $("#myTable").tablesorter({ 
      // sortList:[[0,0],[2,1]] 
     }); 
    }; 
    </script> 
    <title>huh!?</title> 

</head> 

<body> 

<table id="myTable" class="tablesorter" cellspacing="1" cellpadding="0" border="0"> 

<thead> 
<tr>  
<th>name</th> 
<th>type</th> 
<th>Date</th> 
</tr> 
</thead> 

<tbody> 

    <script type="text/javascript"> 

     $.get('myfile.csv', function(data) { 
      myfile = jQuery.csv()(data) 
      for (var x = 0; x < myfile.length; x++) { 
       str = "<tr>"; 
       for (var y = 0; y < myfile[x].length; y++) { 
        str += "<td>" + myfile[x][y] + "</td>"; 
       } 
       str += "</tr>"; 
       $('#myTable').append(str); 
      } 
     }); 

     sortThis(); 
    </script> 

</tbody> 
</table> 
</body> 
</html>

ありがとう：

問題のコードはこれです。

出典

2009-08-09 Anonymous

um誰かがそれが何であるかを推測して推測するチャンスがあると思いますか？レンダリングされたマークアップを提供するか、問題を示すURLを提供する必要があります。針と干し草の春は心に響きます！ – redsquare

私はこの問題を見ずにtablesorterプラグインを使用しました。関連するコードスニペットとテーブルマークアップを投稿するべきだと思います。 – tvanfosson

http://jsbin.comで問題のスキムダウン版を提供できますか？ –

javascriptエラーにはコメントできません。しかし、問題の表示部分は、tbodyではなく、テーブルに文字列を追加することです。

変更この：これに

$('#myTable').append(str);

：

$('#myTable tbody').append(str);

出典

2009-08-09 16:07:55 Mark

これを試したところ、私はまだ同じ表示エラーが発生しています。 –

jquery csvで問題が発生しているようです。私は手動でデータの配列を設定すると、あなたのforループは正しく表示されます： "myfile = [[a '、' b '、' c ']、[' d '、' e '、f']]" – Mark

データはcsvファイルから正しく解析されており、jquery.csvは期待どおりに動作しています。問題は、列をソートしようとすると、tablesorterプラグインにありますが、何が間違っているのか分かりませんでした。 –

私はあなたが完全にあなたがそれをソートするためにしようと時間によって書かれていないテーブルで正しい軌道に乗っていたと思います。 javascriptは前の関数が終了したときにのみ次の関数を開始しますが、ブラウザがスレッド化されているため、DOMの更新が完了したことを保証できません。

Jqueryは、関数を実行する前にDOM要素がロードされるまで待機するメソッドを提供します。これはready（function（）{...}）メソッドです。

私はどこにあなたのsortThis（）関数を呼び出し、次の交換をしようとするだろう：


$(document).ready(function() { 
    sortThis(); 
});

DOMはsortThis（）を実行しようとする前に、読み込みが完了するまで、これが待機します。

これを書いているうちに、$ .get（）を使用してテーブルを更新してDOMがロードされていないことを確認しましたが、上記の解決方法はテーブルが実行される前に実行される可能性がある完全にロードされます。 $ .get（）関数は 'バックグラウンドで'データを取得しますので、あなたのgetThis（）関数は、取得リクエストがで始まるとすぐに実行されるので、はcomletedされません。 2つの可能な解決策があります：1つはget要求にasync = falseを指定することです。この方法では、GET要求が完了してコールバック関数が実行されるまで次の関数は実行されません。私の意見では


    $.get('myfile.csv', async=false, function(data) { 
      myfile = jQuery.csv()(data) 
      for (var x = 0; x "; 
       for (var y = 0; y " + myfile[x][y] + ""; 
       } 
       str += ""; 
       $('#myTable').append(str); 
      } 
     }); 

     sortThis();

より良い解決策は、コールバック関数の中で、あなたのsortThis（）の呼び出しを置くことです。これにより、サーバーの通信が行われている間、スクリプトの残りの部分が実行されるため、読み込みと処理に要する時間が短縮されます。私は、次の解決策を使用します：


    $.get('myfile.csv', function(data) { 
      myfile = jQuery.csv()(data) 
      for (var x = 0; x "; 
       for (var y = 0; y " + myfile[x][y] + ""; 
       } 
       str += ""; 
       $('#myTable').append(str); 
      } 
      sortThis(); 
     });

私はあなたが得る結果を知って欲しい...）

出典

2009-08-23 12:55:49 sillyMunky

同様の問題が発生しましたが、ヘッダーを除いてテーブルが空だったため、エラーが発生しました。私はあなたと同じ理由でエラーが発生していると思います。

問題は、テーブルのデータが$ .get（）メソッドを使用して読み込まれた後に変更しているので、テーブルのデータを認識していないということです。表データの変更をtablesorterに通知するには、sortThis（）を呼び出す前にこの呼び出しを使用します。あなたの問題を処理する必要があり

$('#myTable').trigger("update");

。

tablesorter呼び出しの一環として、あなたもこのエラーを回避するには、次の構文を使用することができます。

$('#myTable:has(tbody tr)').tablesorter({ 
... 
});

私はjQuery Google Group postingのヘルプを発見しました。

出典

2010-05-06 14:45:34

私は空のテーブルと同じ問題があり、metcalfeの解決策はそれを修正します。 – emeraldjava

空のテーブルに問題がありました。私は：（tbody tr）のソリューションが好きです。シンプルでエレガント:) –

-___-私はテーブルリーダーがtbodyタグなしで動作できないことを知らなかった、この投稿は私の人生を保存する.. – Kokizzu

jQuery tablesorter sorting not working

答えて

関連する問題