Adding extra params to store api crashes webservice

[Misiu]

I've declared store like so:



Ext.define('Urlopy.Store.Plan', {
extend : "Sch.data.EventStore",
autoLoad : true,
autoSync : true,
batch : false,
proxy : {
type : 'ajax',
sortParam : undefined,
startParam : undefined,
pageParam : undefined,
limitParam : undefined,
noCache : false,
extraParams : {view: 'all'},
//actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"},//also tried this
headers : {
"Content-Type" : "application/json; charset=utf-8"
},
api : {
read : 'services/Terminy.asmx/Get',
create : 'services/Terminy.asmx/Create',
destroy : 'services/Terminy.asmx/Delete',
update : 'services/Terminy.asmx/Update'
},
reader : {
type : 'json',
root : 'd.data'
},
writer : {
type : 'json',
encode : false,
writeAllFields : true,
root : 'data'
}
},
listeners : {
update : function() {
//console.log('data changed');
}
},
model : 'Urlopy.Model.Plan'
});


I have problem with adding extra parameters to my store, somehow extJS sends them as string not like JSON.

What I need is to change event store GET behaviour, when I pass 'all' I want to load all events when I pass 'user' I would like to load events for current user only, just need to load different sets of data based on my param.

I've created button in tbar:


{
text : 'All',
icon : 'resources/images/calendar.png',
enableToggle : true,
//scope : this,
listeners: {
scope: this,
toggle: function(btn, pressed) {
if(pressed){
btn.setText('User');
this.eventStore.proxy.extraParams.view = 'all';
} else {
btn.setText('All');
this.eventStore.proxy.extraParams.view = 'user';
}
this.eventStore.load();
}
}
}


Searching trough sencha api I found extraParams section, but when I try to use it as so I get error on server-side:



{"Message":"Nieprawidłowy element pierwotny JSON: plan.","StackTrace":" w System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializePrimitiveObject()\r\n w System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal(Int32 depth)\r\n w System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit, JavaScriptSerializer serializer)\r\n w System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)\r\n w System.Web.Script.Services.RestHandler.GetRawParamsFromGetRequest(HttpContext context, JavaScriptSerializer serializer, WebServiceMethodData methodData)\r\n w System.Web.Script.Services.RestHandler.GetRawParams(WebServiceMethodData methodData, HttpContext context)\r\n w System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)","ExceptionType":"System.ArgumentException"}


It looks like somehow ext JS is encoding extra params so that they aren't pass correct.

I sure that my webservice works because I've checked it with jquery:



$("#test").click(function() {
jQuery.ajax({
type: 'POST',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: "{view:'all'}",
url: 'http://localhost:3253/services/Terminy.asmx/Get',
success: function(result) {
alert(result);
}
});
});


What I need to do is to add default param for GET operation (if it is possible only for this one) and sometimes be able to change it so that using it I will be able to change events that come from server.

Removing extraParams and changing api section of proxy to:

api : {
read : 'services/Terminy.asmx/Get?view="all"',
create : 'services/Terminy.asmx/Create',
destroy : 'services/Terminy.asmx/Delete',
update : 'services/Terminy.asmx/Update'
}
helped, but this is just different url for operation. Can this be changed at runtime? This is second option: to remove extraParams and change url for read operation at runtime.

[skirtle]

Could you explain what format your server is expecting? Whatever it is it looks strange. Are you just trying to add quoted parameters to the requests, like this?


proxy.extraParams.view = '"all"';

[Misiu]

Adding quotes helped :)
Normally READ operation is send as GET, when I change it po POST like this:

actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"}, it crashes again.

This is my webservice method that works when I use GET:



[ScriptMethod(ResponseFormat = ResponseFormat.Json, XmlSerializeString = false, UseHttpGet = true)]
public object Get(string view)
{
if (view == "realizacja")
return new { data = _db.Plans.SingleOrDefault(b => b.id == 144) };
return new { data = _db.Plans };
}


This is the request that is send to my server:

http://localhost:3253/services/Terminy.asmx/Get?view="plan"

Using FireBug I can see parameters passed in request:
36844

But when I try to do POST (I've removed UseHttpGet = true from ScriptMethod) I get:

36845
36846

Somehow this isn't working.

What I'm trying to do is to change store content depending on parameter.
The easiest way for me was to pass parameter to server and reload my store.

I need to pass that parameter only to READ operation, so sometimes request will look like:

http://localhost:3253/services/Terminy.asmx/Get?view=plan
and sometimes:

http://localhost:3253/services/Terminy.asmx/Get?view=all

Are those quotes necessary? Can I somehow remove them?

Anyway thanks @skirtle for that tip, for now I'm leaving this as temporary solution, but I would like to do it 'the proper way'

[skirtle]

The quotes are entirely unnecessary from an ExtJS point of view. As far as I can tell all your problems lie in your web service.

Using the Net tool in Firebug is the right way to go. Split the task into two separate chunks. First, get ExtJS sending the request you want it to send. Don't worry about whether the server throws an error, just get the request correct. Then modify your web service to handle that request correctly.