extjs gridpanel：GridPanelウィンドウが再び表示されるときにColumnModelがnullになる

Question

ColumnModelとStoreをあらかじめ設定してGridPanelを定義し、このGridPanelをExt.Windowに配置しました。このウィンドウが表示されても問題なく動作しますが、閉じて再度表示すると、GridPanelのColumnModelがnullになり、このGridPanelが正しくレンダリングできなくなります。 UPDATED

（すべてのコード）

var stSummary = new Ext.data.JsonStore({ //define the store for Summary_Grid 
     fields : [ 
     { 
      name: 'recID' 
     }, { 
      name : 'name', 
     }], 
     data: [] 
    }); 

var colModelSummary = { //define the ColumnModel for Summary_Grid 
    columns: 
    [ 
     { 
      header : "ID", 
      width : 50, 
      sortable : true, 
      menuDisabled: true, 
      dataIndex : 'recID' 
     }, 
     { 
      header : "Name", 
      width : 100, 
      sortable : true, 
      menuDisabled: true, 
      dataIndex : 'name' 
     } 
    ] 
}; 

var reportConfig = { 
    id : 'Report_Window', 
    width : 250, 
    floating : true, 
    style : { 
     opacity : 0.7, 
    }, 
    title : "Report", 
    layout: 'fit', 
    items : [{ 
     xtype: 'tabpanel', 
     id: 'Report_Tab', 
     height: 200, 
     activeTab: 1, 
     items: 
     [ 
      { 
       xtype : 'grid', 
       store : stSummary, 
       colModel : new Ext.grid.ColumnModel(colModelSummary), 
       stripeRows : true, 
       id : "Summary_Grid", 
       title : "Summary at", 
       sm : new Ext.grid.RowSelectionModel({ 
        singleSelect : true 
       }), 
       listeners: { 
        'beforerender': function() { 
         console.log(this.getColumnModel().getColumnCount()); 
        } 
       } 
      }, 
      { 
       xtype : 'form', 
       id : 'Report_Form', 
       title: 'Item Report', 
       frame : true, 
       labelAlign : 'left', 
       bodyStyle : 'padding:2px', 
       autoScroll: true, 
       layout : 'column', 
       items : [] 
      } 
     ] 
    }], 
    resizable : { 
     dynamic : true 
    } 
}; 
var reportWindow = new Ext.Window(reportConfig); 

reportWindow.show(); 

document.onclick = myClickHandler; 


    function myClickHandler() { 
     if(!Ext.getCmp('Report_Window')) { 
     var reportWindow = new Ext.Window(reportConfig); 
     } 

     Ext.getCmp('Report_Window').show(); 
    } 
}); 

とエラー：

Uncaught TypeError: Cannot read property 'length' of undefined 
Ext.grid.ColumnModel.Ext.extend.getColumnCount     ext-all.js:11 

Answer 1

私は実際にちょうど私のアプリケーションにコードを貼り付けコピーします。最後にreportWindow.show（）を追加しました。何が間違っているのかわからない、すべてのコードを表示できますか？

問題が近い/隠れている可能性があることに注意してください。毎回ウィンドウを再作成しますか？

EDIT：

があなたのウィンドウ構成にcloseAction: 'hide'を設定してください。詳細については、

チェックこれを：

http://docs.sencha.com/ext-js/3-4/#!/api/Ext.Window-cfg-closeAction

EDIT＃2：

私は再びあなたのコードをテストし、それが再び動作します！私は余分なカンマのようないくつかのものを修正しました - 私のresharperはそれを提案しました。 （それはIEで問題を引き起こすかもしれない）そして私はExt.onReadyにそれを置いた - それは動作します！お返事のための

Ext.onReady(function() { 
    var stSummary = new Ext.data.JsonStore({ 
//define the store for Summary_Grid 
      fields: [ 
       { 
        name: 'recID' 
       }, { 
        name: 'name' 
       }], 
      data: [] 
     }); 

    var colModelSummary = { 
//define the ColumnModel for Summary_Grid 
     columns: 
      [ 
       { 
        header: "ID", 
        width: 50, 
        sortable: true, 
        menuDisabled: true, 
        dataIndex: 'recID' 
       }, 
       { 
        header: "Name", 
        width: 100, 
        sortable: true, 
        menuDisabled: true, 
        dataIndex: 'name' 
       } 
      ] 
    }; 

    var reportConfig = { 
     id: 'Report_Window', 
     width: 250, 
     floating: true, 
     style: { 
      opacity: 0.7 
     }, 
     title: "Report", 
     layout: 'fit', 
     items: [{ 
      xtype: 'tabpanel', 
      id: 'Report_Tab', 
      height: 200, 
      activeTab: 1, 
      items: 
       [ 
        { 
         xtype: 'grid', 
         store: stSummary, 
         colModel: new Ext.grid.ColumnModel(colModelSummary), 
         stripeRows: true, 
         id: "Summary_Grid", 
         title: "Summary at", 
         sm: new Ext.grid.RowSelectionModel({ 
          singleSelect: true 
         }), 
         listeners: { 
          'beforerender': function() { 
           console.log(this.getColumnModel().getColumnCount()); 
          } 
         } 
        }, 
        { 
         xtype: 'form', 
         id: 'Report_Form', 
         title: 'Item Report', 
         frame: true, 
         labelAlign: 'left', 
         bodyStyle: 'padding:2px', 
         autoScroll: true, 
         layout: 'column', 
         items: [] 
        } 
       ] 
     }], 
     resizable: { 
      dynamic: true 
     } 
    }; 
    var reportWindow = new Ext.Window(reportConfig); 

    reportWindow.show(); 

    document.onclick = myClickHandler; 


    function myClickHandler() { 
     if (!Ext.getCmp('Report_Window')) { 
      reportWindow = new Ext.Window(reportConfig); 
     } 

     Ext.getCmp('Report_Window').show(); 
    } 
});