extjs 저장 데이터를 그리드에 바인딩하는 방법

Question

나는 extjs에서 일하고 있습니다. 내가

Ext.define('Balaee.view.qb.qbqns.allQuestionPapers' , 
     { 
    extend: 'Ext.grid.Panel', 
    alias: 'widget.paperlist', 
    id:'paperId', 
    store:'QbqnsStore', 
    border:false, 
    height:300, 
    width:450, 
    columns: [ 
       { 
        text: 'date', 
        width: 150, 
        dataIndex: 'creationTime' 
       }, 
       { 
        text: 'QuestionpaperNo', 
        width: 150, 
        dataIndex: 'questionPaperNo', 
       }, 
       { 
        text: 'Marks', 
        width:150, 
        dataIndex: 'obtainMarks' 
       } 
       ] 
     }); 

내가 getAllPapers 버튼을 클릭에 호출하고이 뷰 된 직후 grid.i 뷰를 생성 한 표시되는 뷰를 생성하고있다. 그래서 내가 작성한 코드는 위의 함수에서

getAllPapers:function() 
    { 
     var getPaperStore=Ext.create('Balaee.store.qb.QbqnsStore'); 
     proxy=reviewQuestionStore.getProxy(); 
     Ext.apply(proxy.api,{ 
      read:'index.php/QuestionBank/qbpaper/getUserAllQuestionPaper', 
     }); 

     var temp2=Ext.getCmp('QbqnsResultmainId'); 
     temp2.removeAll(); 
     var papers=Ext.create('Balaee.view.qb.qbqns.allQuestionPapers'); 
     temp2.add(papers); 

    } 

된 직후 나는

{" Papers ":[{"questionPaperId":"29","questionPaperNo":"11","userId":"106","allocatedTime":null,"completedTime":"0000-00-00 00:00:00","createDate":"0000-00-00 00:00:00","obtainMarks":null},{"questionPaperId":"30","questionPaperNo":"11","userId":"106","allocatedTime":null,"completedTime":"0000-00-00 00:00:00","createDate":"0000-00-00 00:00:00","obtainMarks":null},{"questionPaperId":"31","questionPaperNo":"11","userId":"106","allocatedTime":null,"completedTime":"0000-00-00 00:00:00","createDate":"0000-00-00 00:00:00","obtainMarks":null}] } 

는 이제 상점이 위의 JSON 데이터를 가지고있다 된 직후 JSON을 얻기 위해 필요한 URL을 호출하고 그리고 난 그것을 제공 할 그리드보기. 그러나 그리드에 데이터가 표시되지 않습니다. 그렇다면 저장소 데이터를 그리드에 바인딩하는 방법은 무엇입니까? 내가 바꿀 필요가있는 것은 무엇인가?

Answer 1

자체를 초기화하는 동안 저장소를 표에 바인딩해야합니다. 내 경우에는 다음과 같이했다 : 프록시와

Ext.define('App.store.Activity', { 
    extend: 'Ext.data.Store', 
    id: 'activityStore', 
    model: 'App.model.Activity', 
    autoLoad: true, 
    data : [ 
      {activityName: 'Bath', createdBy: 'Spencer', scheduleTime: '7.00'}, 
      {activityName: 'Breakfast', createdBy: 'Maintz', scheduleTime: '8.00'}, 
      {activityName: 'Wakeup', createdBy: 'Conran', scheduleTime: '5.00'} 
     ] 
});` 

:

Ext.define('App.store.Activity', { 
    extend: 'Ext.data.Store', 
    id: 'transactionSummaryStore', 
    model: 'App.model.Activity', 
    proxy: { 
     type: 'ajax', 
     url: 'getActivities.htm', 
     reader: { 
      type: 'json', 
      root: 'results' 
     } 
    } 
}); 

App.store.Activity이 (프록시없이 )으로 정의된다

Ext.define('App.view.activity.ListPanel', { 

    extend: 'Ext.panel.Panel', 
    alias: 'widget.listPanel', 

    requires: [ 
     'Ext.data.ArrayStore' 
    ], 

    initComponent: function(){ 

     var activityStore = Ext.create('App.store.Activity'); 
     activityStore.load(); // this line to load is used when we use proxy in store, if we go with out proxy it is not necessary 

     Ext.apply(this, {    
       items: [{ 
        xtype: 'grid',     
        hideHeaders: true, 
        scroll: false, 
        width: 200, 
        height: 700, 
        store: activityStore, 
        stripeRows:true, 
        columnLines:true, 
        columns:[ 
         {text:"Activity Name",flex:1,dataIndex:"activityName"} 
         ]     
       }]  
     }); 

     this.callParent(arguments); 
    } 
}); 

여기서 모델은 다음과 같이 정의됩니다.

Ext.define('App.model.Activity', { 
    extend: 'Ext.data.Model', 
    fields : [ { 
     name : 'activityName' 
    }, { 
     name : 'createdBy' 
    }, { 
     name : 'scheduleTime' 
    } ] 
});