Populate the Sencha select field value by dynamically

See more:

.NET

Hello,

I am using Sencha 'selectfield'. I want load the select field value dynamically.

I can able to load the data by hard code. But I am trying to load value from my .net handler page. My handler (ashx) will return as Json format. So I want read the result and I want load the data into sench selectfield control.

For that I am using the following code.

Ext.define('Gender', 
{
	extend: 'Ext.data.Model',
	config: 
	{
		fields: 
		[
			{
				name: 'Id', type: 'int'
			},
			{
				name: 'Gender',  type: 'string'
			}           
		]
	}
});


var myServiceCategory = Ext.create('Ext.data.Store', 
{
	str:'s',
	model: 'ServiceCategoryModel',	
	// proxy: 
	// {	 
		// type: 'jsonp',
		// url: 'http://localhost/MyHandlerPage.ashx',		
		// callbackKey: 'callback',		
		// scope: this,
		// reader: 
		// {
			// type: 'json'              
		// }						
    // },	
	// listeners: {			
	
    // callback : function(r, options, success) {
        // console.log(r.data)
    // },
		// load: function(store, records, success) 
		// {     	
			// console.log(store);
			// console.log(records);
			// console.log(success);			
		// },
		// exception:function(proxy, response)
		// {
			 // console.error(response.responseText);
		// }
	// },

	autoLoad: true,
	data : 
	[
		{
			Id: 1, Gender: 'Male'
		},
		{
			Id: 2, Gender: 'Female'
		},
		
	]   
});

From above code I can directly load the value by hard code. But I want call my .net ashx page. It is returning Json format value also. But I dont know how to get that value and how to populate the value into select field. Please find my commented line code for calling ashx page.

Please help me.