Load Asp.net web service response in Sencha touch data store..

Question

Hello

My Asp.net Web Service code is as follows :

---------------------------------------------------------------------------------------
public class DemoService : System.Web.Services.WebService
{

[WebMethod]
public string HelloWorld()
{
return "Hello World";
}

[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true)]
public string Test()
{
string str = "[{\"username\":\"Admin\",\"first_name\":\"Admin\",\"last_name\":\"istrator\",\"initials\":\"ADM\"}]";
return str;
}

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)]
public Alert[] GetAlerts()
{
Alert[] p = new Alert[2];
p[0] = new Alert(1, "1aadd", "ddd");
p[1] = new Alert(2, "2aadd", "aaaa");
return (p);
}
}


public class Alert
{
public string Name { get; set; }
public string Description { get; set; }
public int ID { get; set; }

public Alert() { }

public Alert(int Key, string firstname, string lastname)
{
ID = Key;
Name = firstname;
Description = lastname;
}
}

---------------------------------------------------------------------------------------
Now I want to call GetAlerts() method using ajax call .So I added following code...

Ext.Ajax.request({
method: 'post',
url: 'http://localhost:5467/Service.asmx/GetAgents',
success: function (response, request) {
alert('hit!')
alert(response.responseText)
},
failure: function (response, request) {
alert('uh-oh! - hit')
console.dir(response)
}

But it is returning XML instead of JSON.Why it is returning Xml and How can I get JSON ?

Now I wanted to load data in store and wanted to display it in List ..

Ext.setup({

fullscreen: true,
glossOnIcon: false,
onReady: function () {

Ext.regModel('User', {
fields: [{
name: 'AgentID'
}, {
name: 'FirstName'
}, {
name: 'LastName'
}]
});


var xmlstore = new Ext.data.Store({
model: 'User',
method: 'POST',
proxy: {
url: 'http://localhost:5467/Service.asmx/GetAgents',
type: 'ajax',
reader: {
type: 'xml',
root: 'DocumentElement',
record: 'match'
}
}
});

xmlstore.load();

var xmlList = new Ext.List({
title: 'xmlList',
fullscreen: true,
itemSelector: '.match',
itemTpl: '<tpl for="."><div class="match">{FirstName} {LastName}</div></tpl>',
store: xmlstore
});


var p = new Ext.TabPanel({
fullscreen: 'true',
items: [xmlList]
});

}
});


But its not working...

If anyone know Please tell me how to get it working ??


Or how can I load XML data in DataStore ?