2009-07-14 4 views
4

DataGridオブジェクトを含むウィジェットを使用しています。ウィジェットは、最初のタブ(これは可視タブです)に含まれているとうまく動作しますが、2番目のタブで同じコードを使用するとうまく動作しません。Dojox.grid.DataGrid - ウィジェット内 - 可視タブ上でのみレンダリング

コードは同じですが、他の問題がないことを確認するためにいくつかのチェックを行いました。グリッド以外のコードが問題なくレンダリングされています。私は手動で高さと幅を設定しようとしましたが、これは2番目のタブに大きな灰色の四角形を表示します。

何らかの方法で更新するようにグリッドに指示する必要がありますか?TabContainerのプロパティですか?

ヘルプ - これが私を怒らせる!

答えて

5

ええ、それはグリッドに大きな問題です。タブコンテナで宣言的に使用すると、非表示のタブでは正しく表示されません。あなたが見たように、高さ/幅を計算する必要があります(指定しても)。

私が周りに乗っている方法は、タブ選択でプログラムでグリッドを作成することでした。 dojo forumsに私の解決策を掲載しました。私のコードサンプルはgithub.にあります。ここに投稿するには大きすぎます。あなたがそれを望むなら私に教えてください、私は私の答えを編集します。

nabbleについてのディスカッションも、別の解決策があります。

0

代替方法として、タブ要素の選択時にグリッドのサイズを変更する方法があります。サンプルコード

dojo.connect(dijit.byId( 'my_tab_container')、 "selectChild"、機能(子供が){

 // if second tab (could be any...) selected 
     if(child.id == 'mySecondTabId'){ 
      var myGrid = dijit.byId('myGridInsideTabId'); 
      if(myGrid != null) myGrid.resize(); 
     } 
    }); 
+0

このコードを追加する場所は不思議ですか? –

1

"サイズ変更するには" 魔法のように動作!長い間、この探して

このルーチンを使用して、タブに複数のデータグリッドがあるかどうかを動的に判断します.1つのグリッドのIDがわからない可能性がありますそうでなければ、それを使うかもしれません:

dojo.query('div#container div[id^="gridNode_"]').forEach(function(node, index, arr) { 
    dijit.byId(node.id).resize(); 
    }); 

"gridNode_"で始まるIDを持つdivのdivをid="container"(DOM全体を検索する場合はその部分をスキップ)でチェックし、それらのウィジェットに "resize"を適用します。

関連する問題