그리드 데이터가 ExtJs 앱에 표시되지 않습니다

Question

ExtJs 4.1.0을 사용하고 있으며 원격 json 저장소가 지원하는 데이터 그리드를 표시하려고합니다. 그리드를 이렇게 렌더링하면 :

Ext.Loader.setConfig({enabled:true}); 
Ext.Loader.setPath({ 
    'Grip':'app' 
    ,'Ext.ux':'ext/examples/ux' 
}); 
Ext.require([ 
    'Grip.view.EditableGrid' 
    ,'Grip.store.UYNMeetingTypes' 
    ,'Grip.view.UYNMeetingGrid' 
    ,'Grip.model.UYNMeeting' 
    ,'Grip.store.UYNMeetings' 
    ,'Ext.ux.CheckColumn' 
]); 

Ext.require([ 
    'Ext.panel.*', 
    'Ext.toolbar.*', 
    'Ext.button.*', 
    'Ext.container.ButtonGroup', 
    'Ext.layout.container.Table', 
    'Ext.tip.QuickTipManager' 
]); 

Ext.onReady(function() { 

    var store = new Grip.store.UYNMeetings(); 
    grid = new Grip.view.UYNMeetingGrid({ 
     store: store 
     ,renderTo: Ext.getBody() 
    }); 
    store.load({ 
     // store loading is asynchronous, use a load listener or callback to handle results 
     callback: function(){ 
      Ext.Msg.show({ 
       title: 'Store Load Callback', 
       msg: 'store was loaded, data available for processing', 
       modal: false, 
       icon: Ext.Msg.INFO, 
       buttons: Ext.Msg.OK 
      }); 
     } 
    }); 
}); 

잘 작동합니다. 그러나 MVC 튜토리얼 (http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-2/)에서 제안 된 방식을 사용하여 연결하려고하면 데이터를 표시 할 수없는 것처럼 보입니다. 저는 Chrome 20.0.1132.47에서 ExtJs 4.1.0을 실행하고 있습니다. 어떤 아이디어?

코드의 최소 관련 비트 만 게시하려고했습니다 (여전히 많은 것으로 보입니다). 내가 분명히 할 수있는 것이 있으면 알려줘. 어떤 도움이라도 대단히 감사하겠습니다. 감사!

Grip.controller.UYNMeeting :

Ext.define ('Grip.controller.UYNMeeting'{ 연장 'Ext.app.Controller'

refs: [{ 
    ref: 'meetingGrid', 
    selector: 'uynmeetinggrid' 
}], 

stores: ['UYNMeetings','UYNMeetingTypes'], 

init: function() { 

}, 

onLaunch: function() { 
    var meetingsStore = this.getUYNMeetingsStore();   
    meetingsStore.load({ 
     callback: this.onMeetingsLoad, 
     scope: this 
    }); 
    var meetingTypesStore = this.getUYNMeetingTypesStore();   
    meetingTypesStore.load({ 
     callback: this.onMeetingTypesLoad, 
     scope: this 
    }); 
}, 

onMeetingsLoad: function() { 
}, 

onMeetingTypesLoad: function() { 
    Ext.Msg.show({ 
     title: 'Store Load Callback', 
     msg: 'store was loaded, data available for processing', 
     modal: false, 
     icon: Ext.Msg.INFO, 
     buttons: Ext.Msg.OK 
    }); 
} 

을});

Grip.view.UYNMeetingGrid :

var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', { 
    clicksToMoveEditor: 1, 
    autoCancel: false 
}); 

Ext.define('Grip.view.UYNComboBox', { 
    extend:'Ext.form.field.ComboBox' 
    ,alias:'widget.uyncombo' 
    ,stores:['UYNMeetingTypes'] 
}) 

Ext.define('Grip.view.UYNMeetingGrid', { 
    extend:'Ext.grid.Panel' 
    ,alias:'widget.uynmeetinggrid' 

    ,stores:['UYNMeetings'] 
    ,title:'UYN Meetings Grid' 
    ,hideHeaders: true 

    ,bodyPadding:5 
    ,width:550 
    ,height:400 
    ,autoScroll: true 

    ,initComponent:function(){ 
     this.columns = [{ 
      "width": 150, 
      "text": "Name", 
      "sortable": true, 
      //"id": "name", 
      "dataIndex": "name", 
      editor: { 
       allowBlank: false, 
       xtype: 'textfield' 
      } 
     }, 
     { 
      "width": 150, 
      "text": "Org.", 
      "sortable": true, 
      //"id": "org", 
      "dataIndex": "org", 
      editor: { 
       allowBlank: true, 
       xtype: 'textfield' 
      } 
     }, 
     { 
      "width": 100, 
      "text": "Date", 
      "sortable": true, 
      //"id": "date", 
      "dataIndex": "date", 

      editor: { 
       xtype: 'datefield', 
       allowBlank: false, 
       format: 'm/d/Y', 
       maxText: 'Cannot have a meeting date in the future!', 
       maxValue: Ext.Date.format(new Date(), 'm/d/Y') 
      } 
     }, 
     { 
      "width": 75, 
      "text": "Meeting Type", 
      "sortable": true, 
      //"id": "meeting_type", 
      "dataIndex": "meeting_type"/*, 
      editor: { 
       xtype: 'uyncombo' 
      }*/ 
     }, 
     { 
      "width": 75, 
      "text": "Num Hours", 
      "sortable": true, 
      //"id": "num_hours", 
      "dataIndex": "num_hours", 
      editor: { 
       allowBlank: false, 
//     step: '.1', 
       xtype: 'numberfield' 
      } 
     }]; 

     this.dockedItems = [{ 
      dock:'bottom' 
      ,xtype:'toolbar' 
      ,items: [{ 
       xtype:'button' 
       ,text:'New' 
       ,action:'newuynmeeting' 
      }, { 
       xtype:'button' 
       ,text:'Edit' 
       ,action:'edituynmeeting' 
      }, { 
       xtype:'button' 
       ,text:'Remove' 
       ,action:'removeuynmeeting' 
      }] 
     }]; 

     this.callParent(); 
    } 

    ,plugins: [rowEditing] 
    ,listeners: { 
     'selectionchange': function(view, records) { 
//   grid.down('#removeEmployee').setDisabled(!records.length); 
     } 
    } 


}); 

Grip.view.Viewport :

Ext.define('Grip.view.Viewport', { 
    extend: 'Ext.container.Viewport', 
    layout: 'fit', 

    requires: [ 
     'Grip.view.ContactsPanel' 
     ,'Grip.view.UYNMeetingForm' 
     ,'Grip.view.UYNMeetingGrid' 
     ,'Grip.view.NavBar' 
    ], 
    renderTo: 'app', 
    tbar:{ 
     xtype:'mynavbar' 
    }, 
    items:[{ 
     xtype:'tabpanel', 
     items:[{ 
      title:'Contacts', 
      xtype:'tabpanel', 
      items:[{ 
       title:'Contacts' 
       ,xtype:'contactspanel' 
      },{ 
       title:'Add Contact' 
       ,html:'TODO: Add content' 
      } 
      ] 
     },{ 
      title:'UYN', 
      xtype:'tabpanel', 
      items:[{ 
       title:'UYN Meetings' 
       //,html:'Foo' 
       ,xtype:'uynmeetinggrid' 
      }] 
     }] 
    }] 

}); 

Answer 1

가 오타인지 모르겠지만, 그리드가 stores 설정이 없습니다 - 한 상점의 데이터 만 표시 할 수 있으므로 store 구성 (단수, 복수가 아님)