2009-06-23 19 views
6

Yahoo DataTableのAPIがhereの場合は使用しています。作成後にYUIデータグリッドのデータソースを変更する方法

グリッドを一度レンダリングするとデータを変更するのが難しいです。私は、AJAXを介して、またはクライアント側のデータアイランドからデータを取得するためにjQueryを使用しており、これをグリッドに戻す必要があります。

DataTable APIにはsetDataSourceメソッドがありません。また、 'dataSource.liveData'を変更してもグリッドは更新されません。

// does not work 
dataTable.dataSource.liveData = [ {name:"cat"}, {name:"dog"}, {name:"mouse"}; 

私のコードをベースにしている例はbasic LocalDataSource exampleです。

テーブルを完全に再作成せずにデータソースを更新するにはどうすればよいですか。私は非同期呼び出しを行うYUIデータソースを使用したくありません。私はこれを「手動で」行う方法を知る必要があります。

+0

simon、これを確認してください。これはうまくいったのですか? –

+0

私の上司は常に私の優先事項を変えています。私はまだ試してみることにした。 –

答えて

5

データトラックにデータを送信するようにデータソースに指示するのを忘れてしまった。あなたがLocalDataSourceを使用してデータソースにあるものを使用してテーブルにデータを交換したいと仮定すると、livedataを交換した後、あなただけの

dataTable.getDataSource().sendRequest(null, 
    {success: dataTable.onDataReturnInitializeTable}, 
    dataTable); 

はまた、APIリファレンスのDataTableの他のonDataReturnXXX方法を参照しています。置き換えるのではなく、新しいデータを追加することができます。

+0

ありがとうございます。これはうまくいきますが、ページングを設定しておくと、更新後にページ区切りセクションが消えます。あなたは、上記のコードスニペットをページネーションを持つデータテーブルで実行しようとしましたか? もう一度おねがいします! – Abe

0

テーブルを完全に再作成せずにデータソースを更新するにはどうすればよいですか?

「新しい」文を使用しないでください。もしそうなら、私はこれを自分で行う必要はありませんでしたが、私はよくYUIを使います。私は、テーブルの長さから0までのすべての行を削除するために使用できるdeleteRowsメソッドがあることに気付きました。この場合は、あなたのようなリテラル配列とインデックス(0)をとるaddRowsを使用します。

これを試しましたか?

編集:this exampleをご覧ください。あなたがしたいことは間違いなく行うことができます。テーブルは、setIntervalメソッドを使用して設定された間隔でローカルに更新されています(驚くことではありません)。 setIntervalの機能を見てみると、データソースのインスタンスでmakeConnectionが呼び出されていることがわかります。このメソッドはリモート呼び出しを行っているように聞こえますが、必ずしもそうではありません。

例からいくつかの行を見てみましょう。

// Set up polling 
    var myCallback = { 
     success: myDataTable.onDataReturnInitializeTable, 
     failure: function() { 
      YAHOO.log("Polling failure", "error"); 
     }, 
     scope: myDataTable 
    } 
    myDataSource.setInterval(5000, null, myCallback) 

最後の行が一度(またはあなたが必要とオンデマンドで)呼び出される可能性はなく、このようにそれを書き換えることにより、間隔:

onDataReturnInitializeTableメソッドを呼び出します
myDataSource.makeConnection(null, myCallBack) 

- 私はあなたを推測もっと直接的に呼び出すことができます。

とにかく、例に沿って、必要のない部分を取り出してください。最終的には、onDataReturnInitializeTableメソッドがキーであるように見えます。

希望に役立ちます。

+0

はい、私は '新しいYAHOO.datatable()'をやってはいけないということを意味していました。手動で行を追加したり削除したりしなかったのです。私はちょうどそこに本当にテーブル全体を更新する方法だと思った。 YUI AJAX呼び出しが返ってきたら、すべての行を削除して再追加することはできません。それは狂っているだろう。 –

+0

非常に有望です。それをチェックします。はい、間違いなくタイマーではなく即時に実行する必要があります。 –

+0

あなたのためにこの作業ができましたか? –

3

引数プロパティでgetState()の呼び出しを渡すと、ページネーションを保持できることを追加したかっただけです。実際

dataTable.getDataSource().sendRequest(null, 
    { 
     success: dataTable.onDataReturnInitializeTable, 
     argument: dataTable.getState()  
    } 
); 
+1

はうまくいきます!私はそれをどうやってするのだろうと思っていた。 –

0

は、私はそれが仕事を得るためにやったすべては、次の2行のコードである(と私はOPとは異なるので、少しアヤックスから返された)

dataTable.dataSource.liveData = eval(o.responseText); 
dataTable.load({}); 

ので... datatable.load()が読んだことは誰もが何を呼ぶべきかを示唆しています。

関連する問題