PDA

View Full Version : List and Ajax



Limbo
12 Jul 2011, 2:45 AM
I have a list that I need to refresh with Ajax.

I work with ASP.NET. I have a carousel etc. that work with Ajax with no problems, but the list is giving me huge problems.

How is this most easily done?

I tried a method in my Default.aspx file with

[WebMethod()]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]

That returns an object list. Also tried returning a string, but it keeps telling me:

{"Message":"Invalid JSON primitive: limit.","StackTrace":" at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject()\r\n at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal

When I look at the communication with Firefox.

I also tried a .NET webservice, but this also didn't work.

I see lots of examples with static XML files, which is not ideal and files with a .json extension, that I know nothing about. Are there any examples with calls to methods or webservices? Any pointers?

Hanni Sullivan
12 Jul 2011, 3:00 AM
I think your on the right track with your method in the default.aspx file. Since you have tagged it with the "WebMethod" attribute, it should return JSON. I used a similar approach plenty of times, though it has been a while since my last ASP.Net project.

Could you post the code of the method?

Limbo
12 Jul 2011, 4:04 AM
[WebMethod()]
[ScriptMethod(ResponseFormat = ResponseFormat.Xml)]
static public ReadOnlyCollection<PurchaseHeader> GetList()
{
StringBuilder _StringBuilder = new StringBuilder();

ReadOnlyCollection<PurchaseHeader> _PurchaseHeaderCollection = PurchaseHeaderCollection.SortWithLinq(new PurchaseHeaderCollection(IWWebPortal.IWWebCode.Utilities.GetCurrentCompanyId(), "JANWEB", IWEnumerators.DocumentActionType.FlowDocuments, IWEnumerators.PurchaseHeaderFilter.Personal, "", false, false), "DueDate", false, "No", true);

return _PurchaseHeaderCollection;
}

And I call it with this:

Ext.regModel('Contact', {
idProperty: 'id',
fields: ['Id', 'BuyFromVendorName', 'BuyFromVendorNameFull', 'IWAmountInclVAT', 'IWAmountExclVATDec', 'IWAmountInclVATDec', 'Currency', 'Comment', 'CommentFull', 'Wait', 'Timestamp']
});

myStore = new Ext.data.Store({
model: 'Contact',
autoLoad: true,
storeID: 'myStore',
proxy:
{
headers:
{
'Content-Type': 'application/json; charset=utf-8'
},
url: 'Default.aspx/GetList',
type: 'ajax',
actionMethods: {
read: 'POST'
},
reader: {
type: 'json'
}
}
});

This is how it currently looks. I have tried different things, but get that error saying: "Message":"Invalid JSON primitive: limit.","StackTrace":..."

The Model does not contain all properties of PurchaseHeader, but that should be ok?

Hanni Sullivan
12 Jul 2011, 4:34 AM
I don't see any obvious errors so far. Have you checked how the JSON which is returned by the ScriptMethod looks like? Use the "Network" tab of the WebInspector and pass it into JSON Lint (http://jsonlint.com/) which will tell you if anything is wrong with your response.

Limbo
12 Jul 2011, 4:38 AM
This is what it returns:

500 error

{"Message":"Invalid JSON primitive: limit.","StackTrace":" at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject()\r\n at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal(Int32 depth)\r\n at System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit, JavaScriptSerializer serializer)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize[T](String input)\r\n at System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)","ExceptionType":"System.ArgumentException"}

Tried looping the elements and adding them to a StringBuilder also, but got the same result. Thought it could have something to do with the properties on the PurchaseHeader object.

Any suggestions?

Hanni Sullivan
12 Jul 2011, 5:25 AM
It definitely looks like it is unable to serialize your PurchaseHeader objects. Since it seems to mumble something about Int32 depth, you might check what you actually try to serialize. And I would advise you to ask your question in a more .Net centric forum. There are not a whole lot of .Net experts around here afaik.

Limbo
12 Jul 2011, 5:52 AM
I have tested this some more.

Ext.regModel('Contact', {
idProperty: 'Id',
fields: ['Id']
});

This returns the error:

myStore = new Ext.data.Store({
model: 'Contact',
autoLoad: true,
storeID: 'myStore',
proxy:
{
headers:
{
'Content-Type': 'application/json; charset=utf-8'
},
url: 'Default.aspx/GetList',
type: 'ajax',
actionMethods:
{
read: 'POST'
},
reader:
{
type: 'json'
}
}
});

This doesn't:

Ext.Ajax.request({
url: 'Default.aspx/GetList',
method: 'POST',
headers:
{
'Content-Type': 'application/json; charset=utf-8'
},
success: function (response, opts)
{
$('#DivDebug').text(response.responseText);
},
failure: function (response, opts)
{
alert('Error: ' + response.responseText);
}
});

So the .NET method works for one of the calls, but not the other. I have no idea how this could be, as it should be identical. I am calling the same method, without any parameter, but it doesn't work for the DataStore.

The Ext.Ajax.request works correctly and returns valid JSON (validated using the site you suggested).

Very strange. How are these two Ajax calls different?

Limbo
12 Jul 2011, 6:03 AM
This is very strange. I changed the code to just return the JSON string (which is valid) and it still doesn't work. Did this, just to make sure the serialization wasn't causing the problem.

Works for the Ext.Ajax.request method, but not for the Ext.data.Store proxy, which still returns error 500. Must be something with the proxy :/

Limbo
12 Jul 2011, 6:11 AM
YES! I got it... Problem was with the limit

Added limitParam, like this:

type: 'ajax',
limitParam: null,
actionMethods:

And now it returns correctly :)

List is still not showing the data that is in the store, although I am auto loading it. But that shouldn't be too hard to fix - will try to search a little. Guess I just need to reload the list after the data has been loaded or something.

Thanks for the help :)