extjs: إزالة شبكة من tabpanel عندما يكون متجرها الأساسي فارغا

Question

لدي Tabpanel الذي يحتوي على، من بين أشياء أخرى، شبكة متصلة بمتجر.

عدة أحداث قد تزيل العناصر من المتجر.

أرغب في إزالة الشبكة من tabpanel عندما يكون المتجر فارغا، ربما يكون لديك مكان واحد في التعليمات البرمجية للتحقق من هذا الحدث.

فكرت في استخدام مستمعي المتاجر، لكن لسوء الحظ، يؤدي هذا إلى استثناءات في تحويلة التعليمات البرمجية. افتراضي هو أن هذا يحدث لأن العرض يتم تنفيذه على الشبكة بعد إزالة هذا من tabpanel.

أي فكرة حول كيفية إنجاز هذه المهمة دون العبث roper هو موضع تقدير كبير. شكرا :)

بالمناسبة، هذا هو مقتطفات التعليمات البرمجية:

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 - لماذا لا تبقي الشبكة الفارغة مع رسالة "فارغة"؟

على أي حال، أعتقد أن نهجك (باستخدام أحداث المتجر والعدد السجل لتحديد وقت الإزالة) هو أساسا موافق. قد ترغب في معرفة كيفية حل أي أخطاء التي تقولها، كنت تحصل عليها. ماذا كانوا؟