PDA

View Full Version : binding selectfield in Sencha



sucheendarnath
25 Dec 2011, 10:23 PM
I want bind data from WCF to the selectfield in Sencha. Please suggest me a proper method for doing the same. The wcf returns dataset. Do i need to change the dataset to json data?

mitchellsimoens
26 Dec 2011, 6:30 AM
You should transport the data in either JSON or XML with JSON being the preferred means. Once you get that working, then it is a matter of setting up an Ext.data.Store to consume that data.

sucheendarnath
27 Dec 2011, 4:26 AM
I tried returning json format string in WCF service. The WCF service returns the below string.

{"Status" : [{"H_ST_CODE" : "0","H_ST_DESC" : "All","SNO" : "1"},{"H_ST_CODE" : "1","H_ST_DESC" : "Open","SNO" : "2"},{"H_ST_CODE" : "2","H_ST_DESC" : "Assigned","SNO" : "2"},{"H_ST_CODE" : "3","H_ST_DESC" : "In Progress","SNO" : "2"},{"H_ST_CODE" : "4","H_ST_DESC" : "Resolved","SNO" : "2"},{"H_ST_CODE" : "5","H_ST_DESC" : "Closed","SNO" : "2"},{"H_ST_CODE" : "6","H_ST_DESC" : "Hold","SNO" : "2"}]}

The google chrome console shows as below.

d: "{"Status" : [{"H_ST_CODE" : "0","H_ST_DESC" : "All","SNO" : "1"},{"H_ST_CODE" : "1","H_ST_DESC" : "Open","SNO" : "2"},{"H_ST_CODE" : "2","H_ST_DESC" : "Assigned","SNO" : "2"},{"H_ST_CODE" : "3","H_ST_DESC" : "In Progress","SNO" : "2"},{"H_ST_CODE" : "4","H_ST_DESC" : "Resolved","SNO" : "2"},{"H_ST_CODE" : "5","H_ST_DESC" : "Closed","SNO" : "2"},{"H_ST_CODE" : "6","H_ST_DESC" : "Hold","SNO" : "2"}]}"

I register the model as below

Ext.regModel('Status', {
fields: [
{name: 'H_ST_CODE', type: 'string'},
{name: 'H_ST_DESC', type: 'string'},
{name: 'SNO', type: 'string'}
]
});

The code for Store is as below

var statusStore = new Ext.data.JsonStore({
model : 'Status',
proxy: {
type: 'ajax',
url:'http://localhost/efacilitypda/MobileService/MobileService.svc/getStatusall',
reader: {
type: 'json',
root: 'd'
}
},
autoLoad : true,
autoDestroy : true,
//data:[{H_ST_CODE:'o',H_ST_DESC:'Open',SNO:'1' }]
});

I use the following for binding the above store to selectfield in a form
{
xtype: 'selectfield',
name: 'ce_status',
label: 'Status',
centered: true,
id: 'ce_status',
useClearIcon: false,
autoCapitalize: false,
labelAlign: 'top',
displayField: 'H_ST_CODE',
valueField : 'H_ST_DESC',
model:'Status',
store:'statusStore'
}

The select field is not loaded. I am not aware of what i am missing. Please let me know on how to load data returned by WCF service in the selectfield