Sencha 2 - displaying null value in nested List - sencha-touch-2

Question

I am new to sencha. I am developing an app using treestore and nestedList.
I am unable to load data returned from a coldfusion component.it shows null.
Here is my Viewport.js:
Ext.define('Myapp.view.Viewport', {
extend: 'Ext.tab.Panel',
xtype:'newviewport',
config: {
fullscreen: true,
tabBarPosition: 'top',
html: 'hiiiiiiiiiii',
cls:'test',
items: [
{
title: 'Sections',
iconCls: 'home',
xtype: 'sectionslist'
}
]
}
});
My store:samplestore.js
Ext.define('Myapp.store.samplestore', {
extend: 'Ext.data.TreeStore',
config: {
autoLoad: true,
model: 'Myapp.model.sampleModel',
proxy: {
type: 'ajax',
url: '/sample/sample1.cfc?method=getSections',
reader: {
type: 'json',
rootProperty:'DATA'
}
}
}
});
My model: sampleModel.js
Ext.define("Myapp.model.sampleModel", {
extend: "Ext.data.Model",
config: {
fields: [
{name: 'LoginID', type: 'string'},
{name: 'FIRSTNAME', type: 'string'}
]
}
});
My sample1.cfc :
<cfcomponent name="sample" output="false">
<cffunction name="getSections" output="no" returnformat="json" access="remote">
<cfquery name="qryGetDetails" datasource="#request.dsn#">
SELECT TOP 5
LoginID, FIRSTNAME
FROM
tblUser
</cfquery>
<cfreturn qryGetDetails>
</cffunction>
</cfcomponent>
My Sectionslist.js
Ext.define('Myapp.view.Sectionslist', {
extend: 'Ext.dataview.NestedList',
xtype: 'sectionslist',
config: {
store: 'samplestore'
itemTpl: [
'{FIRSTNAME}<br/>'
].join(''),
onItemDisclosure: function(record, btn, index) {
console.log("worked");
}
},
//getItemTextTpl: function(node) {
//console.log(node);
// return node.data.FIRSTNAME+ ':<strong></strong>';
// }
});
And finally my json data:
{"COLUMNS":["LOGINID","FIRSTNAME"],"DATA":[["bt","Jn"],["jr","Jy"],["b20","Best"],["jman","Jeff"],["fenad","Fn"]]}
PLease help to find out my problem, I cant trigger where i went wrong, I am getting null value, as displaying data is wrong.:
itemTpl: [
'{FIRSTNAME}'
].join(''),
Instead of Firstname ,what should i display here??? I tried many methods, but no use, please help.....

Answer 1

Your JSON is returning a collection of Arrays like
["bhpAgent", "Jan"],
but the field definition expects the response to be a collection of objects like
{"LoginID": "bhpAgent", "FIRSTNAME": "Jan"}.
Not sure of the best solution. Can ColdFusion generate JSON objects instead?
If not, maybe subclass Ext.data.reader.JSON and override getResponseData().
Might also be worth checking the TreeStore docs as that view has a further requirement for tree structured data.