PDA

View Full Version : Unable to display JSON Data in Grid



verizon1
17 Jul 2012, 4:52 PM
Hi All,

Please help me to resolve this issue, new to extjs..struggling hard to find out the solution.

Here is the JSON


{"iTotalDisplayRecords":0,"results":[[1,1,1,"CA","-","SNMNCAXP31W","Juniper","ERX 1440","FTTP","Data","02024817WF01AB","Complete",null,null,null],[2,2,2,"CA","-","ONTRCAXP23W","Juniper","ERX 1440","FTTP","Data","02034647WF01AB","Complete",null,null,null],[3,3,3,"NJ","-","RGWDNJRW0FW","Juniper","ERX 1440","FTTP","Data","204596","Complete",null,null,null],[4,4,4,"PA","-","PHLAPALO0FW","Juniper","ERX 1440","FTTP","Data","204226","Complete",null,null,null],[5,5,5,"MA","-","CMBRMABE0FW","Juniper","ERX 1440","FTTP","Data","203374","Complete",null,null,null],[6,6,6,"NY","-","GRCYNYGC0FW","Juniper","ERX 1440","FTTP","Data","203712","Complete",null,null,null],[7,7,7,"NY","-","WHPLNYWP0FW","Juniper","ERX 1440","FTTP","Data","203299","Complete",null,null,null],[8,8,8,"VA","-","ARTNVAAR0FW","Juniper","ERX 1440","FTTP","Data","202087","Complete",null,null,null],[9,9,9,"VA","-","FRBGVAFB0FW","Juniper","ERX 1440","FTTP","Data","203891","Complete",null,null,null],[10,10,10,"MD","-","SLSPMDSS0FW","Juniper","ERX 1440","FTTP","Data","203927","Complete",null,null,null]],"iTotalRecords":0}

Here is the java script code


Ext.require([
'Ext.data.*',
'Ext.grid.*'
]);

Ext.onReady(function(){



var dataStore = new Ext.data.JsonStore({
id: 'store',

proxy: {
url: 'http://localhost:7001/POC1/EquipJobs/EquipJobServlet',
type: 'ajax',

reader: {
type: 'json',
root: 'results'
}

},
fields:[{name:'wfm_job_id',type: 'int', mapping :'wfm_job_id'},
{ name:'state' , type: 'string', mapping :'state'},
{ name:'vendor', type: 'string', mapping :'vendor' },
{ name:'switch', type: 'string', mapping :'switch' },
{ name:'ccr', type: 'string', mapping :'ccr' },
{ name:'status' , type: 'string', mapping :'status'}
]

});






dataStore.load();

// create the Grid
var grid = Ext.create('Ext.grid.Panel', {

store: dataStore,
columns: [
{header: 'WFM Job ID', width: 100, sortable: true, dataIndex: 'wfm_job_id'},
{header: 'State', width: 100, sortable: true, dataIndex: 'state'},
{header: 'vendor', width: 100, sortable: true, dataIndex: 'vendor'},
{header: 'equip_switch', width: 100, sortable: true, dataIndex: 'equip_switch'},
{header: 'ccr', width:100, sortable: true, dataIndex: 'ccr'}
],
renderTo:'tree-div',
width: 800,
height: 300
});


// render grid
//grid.render('tree-div');


});

Please help...

tvanzoelen
17 Jul 2012, 11:09 PM
For the kind of JSON returned, you probably need an ArrayReader

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.reader.Array

else JSON format should be something like this



{
total: 2,
success: true,
data: [{field1: 1, field2: 'label 1' }, {field1: 2, field2: 'label 2' }]

}