수없는

Question

간단한 그리드 는 JSON 형식 MYDATA 3 열 주제 아이디, 주체 이름 및 제목 짧은 이름 .. 을 표시하려고 JSON 데이터를 얻을려고 ... 세 열 표시 데이터가 저장됩니다. myData에 대해 서버에서받은 데이터를 방금 붙여 넣었습니다. 데이터가 표시되지 않는 이유를 모르겠습니다. 데이터 그리드에 표시되지 않는 이유 으로

var myData = {"subjectStoreRoot":[{"subjectName":"Chemistry","subjectId":"Chem01","subjectShortName":"Chemistry"},{"subjectName":"Mathematics","subjectId":"Math01","subjectShortName":"Maths"},{"subjectName":"English","subjectId":"Eng01","subjectShortName":"Eng"},{"subjectName":"Science","subjectId":"Sci01","subjectShortName":"Sci"},{"subjectName":"Social Studies","subjectId":"SS01","subjectShortName":"Social"},{"subjectName":"Kannada","subjectId":"Kan01","subjectShortName":"Kan"}]}; 

store = new Ext.data.ArrayStore({ 


data:Ext.decode(myData), 
             // 
autoDestroy : true, 


    autoLoad:true, 

    storeId: 'subjectsGridStoreId', 

    // reader configs 

    root: 'subjectStoreRoot', 
              // 
    idProperty: 'subjectId', 

    fields: [ 

    {name: 'subjectId' ,type:'string'}, 

    {name: 'subjectName' ,type:'string'}, 

    {name: 'subjectShortName' ,type:'string'} 


               ] 
              }); 

    grid = new Ext.grid.GridPanel({ 
                store: store, 
                stripeRows:true, 
                scrollable:true, 
                columnLines:true, 
                columns: [ 
                 { 
                  id  :'subjectId', 
                  header : 'Subject Id', 
                  width : 250, 
                  sortable : true, 
                  dataIndex: 'subjectId' 
                 },{ 
                  id  :'subjectName', 
                  header : 'Subject Name', 
                  width : 250, 
                  sortable : true, 
                  dataIndex: 'subjectName' 
                 },{ 
                  id  :'subjectShortName', 
                  header : 'Subject Short Name', 
                  width : 250, 
                  sortable : true, 
                  dataIndex: 'subjectShortName' 
                 } 
                ], 
               // autoExpandColumn: 'subjectName', 
                height: 300, 
               // width: 350, 
                autoScroll:true, 
                title: 'List of all Subjects', 
                // config options for stateful behavior 
                stateful: true, 
                stateId: 'grid' 
               }); 

는 안내하세요?

Answer 1

는 몇 가지 고려 있습니다 : 제공된 데이터가 의 간단한 배열이 아닌 것처럼

1. 당신은, Ext.data.JsonStore 대신의 Ext.data.ArrayStore 필요 배열 (Ext.data.ArrayStore에 대한 자세한 내용은 here에서 설명).
2. 나는 또한 만든 Ext.decode

를 사용할 필요가 없습니다 (코드는 아래 첨부) 문제 위의 수정 프로그램 jsFiddle :

var myData = { 
    "subjectStoreRoot": [{ 
     "subjectName": "Chemistry", 
     "subjectId": "Chem01", 
     "subjectShortName": "Chemistry" 
    }, { 
     "subjectName": "Mathematics", 
     "subjectId": "Math01", 
     "subjectShortName": "Maths" 
    }, { 
     "subjectName": "English", 
     "subjectId": "Eng01", 
     "subjectShortName": "Eng" 
    }, { 
     "subjectName": "Science", 
     "subjectId": "Sci01", 
     "subjectShortName": "Sci" 
    }, { 
     "subjectName": "Social Studies", 
     "subjectId": "SS01", 
     "subjectShortName": "Social" 
    }, { 
     "subjectName": "Kannada", 
     "subjectId": "Kan01", 
     "subjectShortName": "Kan" 
    }] 
}; 

store = new Ext.data.JsonStore({ 
    data: myData.subjectStoreRoot, 
    autoDestroy: true, 
    autoLoad: true, 
    storeId: 'subjectsGridStoreId', 
    // reader configs 
    root: 'subjectStoreRoot', 
    // 
    idProperty: 'subjectId', 
    fields: [ 
    { 
     name: 'subjectId', 
     type: 'string' 
    }, 
    { 
     name: 'subjectName', 
     type: 'string' 
    }, 
    { 
     name: 'subjectShortName', 
     type: 'string' 
    }] 
}); 

grid = new Ext.grid.GridPanel({ 
    renderTo: Ext.getBody(), 
    store: store, 
    stripeRows: true, 
    scrollable: true, 
    columnLines: true, 
    columns: [{ 
     id: 'subjectId', 
     header: 'Subject Id', 
     width: 250, 
     sortable: true, 
     dataIndex: 'subjectId' 
    }, { 
     id: 'subjectName', 
     header: 'Subject Name', 
     width: 250, 
     sortable: true, 
     dataIndex: 'subjectName' 
    }, { 
     id: 'subjectShortName', 
     header: 'Subject Short Name', 
     width: 250, 
     sortable: true, 
     dataIndex: 'subjectShortName' 
    }], 
    // autoExpandColumn: 'subjectName', 
    height: 300, 
    // width: 350, 
    autoScroll: true, 
    title: 'List of all Subjects', 
    // config options for stateful behavior 
    stateful: true, 
    stateId: 'grid' 
}); 

Answer 2

1.Simply 대신 상점 또는 jsonStore을 사용 arrayStore의 2. config "data"를 myData.subjectStoreRoot로 설정하십시오.