extjs：基礎となる店が空いているときにタブパネルからグリッドを削除します

Question

私は、とりわけ、店に接続されたグリッドを含むタブパネルを持っています。

いくつかのイベントでは、ストアから要素を削除する場合があります。

ストアが空いているときにタブパネルからグリッドを削除し、おそらくこのイベントをチェックするためにコードに単一の場所を持っていることを望みます。

ストアリスナーの使用を考えましたが、残念ながらこれはExtコードの例外を引き起こします。私の仮定は、これがタブパネルから削除された後にグリッドでレンダリングが実行されるために起こるということです。

Extを台無しにすることなくそのようなタスクを達成する方法についてのアイデアは大歓迎です。ありがとう ：）

ちなみに、これはコードの抜粋です。

var myStore = new Ext.data.Store({
 reader: new Ext.data.JsonReader({fields: MyRecord}),
 listeners:{
  'clear': function(store, recs) {
   myTabPanel.remove(myGrid);
  },
  'remove': function(store, rec, idx) {
   if (store.getCount() == 0) {
    myTabPanel.remove(myGrid);
   }
  }
 }
});

var myGrid = new Ext.grid.GridPanel({
 id: "myGrid",
 title: "A Grid",
 store: myStore,
 frame:false,
 border:false,
 columns: [
 {
  header: 'Remove',
  align:'center',
  width: 45,
  sortable: false,
  renderer: function(value, metaData, record, rowIndex, colIndex, store) {
   return '<img src="images/remove.png" width="34" height="18"/>';
  }
 },{
  header: 'Some Data',
  dataIndex: 'data',
  sortable: true
 }
 ],
 listeners:{
  'cellclick':function(grid, rowIndex, colIndex, e){
   var rec = myStore.getAt(rowIndex);
   if(colIndex == 0){
    myStore.remove(rec);
   }
  }
 } 
});

var myTabPanel= new Ext.TabPanel({ 
 activeTab: 0,
 items: [ fooPanel, barPanel, myGrid]
});

Answer 1

問題解決：「autodestroy」パラメーターを「false」に設定するグリッドを削除する必要がありました。以下のコードを修正しました。

var myStore = new Ext.data.Store({
 reader: new Ext.data.JsonReader({fields: MyRecord}),
 listeners:{
  'clear': function(store, recs) {
   myTabPanel.remove(myGrid, false);
  },
  'remove': function(store, rec, idx) {
   if (store.getCount() == 0) {
    myTabPanel.remove(myGrid, false);
   }
  }
 }
});

var myGrid = new Ext.grid.GridPanel({
 id: "myGrid",
 title: "A Grid",
 store: myStore,
 frame:false,
 border:false,
 columns: [
 {
  header: 'Remove',
  align:'center',
  width: 45,
  sortable: false,
  renderer: function(value, metaData, record, rowIndex, colIndex, store) {
   return '<img src="images/remove.png" width="34" height="18"/>';
  }
 },{
  header: 'Some Data',
  dataIndex: 'data',
  sortable: true
 }
 ],
 listeners:{
  'cellclick':function(grid, rowIndex, colIndex, e){
   var rec = myStore.getAt(rowIndex);
   if(colIndex == 0){
    myStore.remove(rec);
   }
  }
 } 
});

var myTabPanel= new Ext.TabPanel({ 
 activeTab: 0,
 items: [ fooPanel, barPanel, myGrid]
});

Answer 2

タブからグリッドを物理的に削除している理由はありますか？奇妙なUIパラダイムのように思えます - なぜ「空の」メッセージで空のグリッドを保持しないのですか？

とにかく、あなたのアプローチ（ストアイベントとレコードカウントを使用していつ削除するかを決定する）は基本的に問題ないと思います。あなたが得ていると言っているエラーを解決する方法を見つけたいかもしれません。あれは何だった？