Problem with passing object to server with jQuery.Ajax() - asp.net

Question

I am trying to implement the same code that was mentioned in this question
Currently I have the following code:
var pagePath = window.location.pathname;
var paramList = '';
if (paramArray.length > 0) {
for (var i = 0; i < paramArray.length; i ++) {
if (paramList.length > 0) paramList += ',';
paramList += "{'id':'" + paramArray[i].id + "',
'collapsed':'" + paramArray[i].collapsed + "',
'order':'" + paramArray[i].order + "',
'column':'" + paramArray[i].column + "'}";
}
}
paramList = '[' + paramList + ']';
$.ajaxSetup({ cache: false });
//Call the page method
$.ajax({
type: "POST",
url: pagePath + "/" + fn,
contentType: "application/json; charset=utf-8",
data: "{'items': **'**" + $.toJSON(paramList) + "**'**}",
dataType: "json",
success: successFn,
error: errorFn
});
I am trying to pass this data to the WebMethod
[WebMethod]
public static String SaveData(Dictionary<String, Object>[] items)
The problem is that I keep receiving the error "500 Internal Server Error".
I'm pretty sure that the data type is causing the problem but just can't figure it out.
Any ideas?

Answer 1

Is your service decorated with [ScriptService] attribute?
and what's up with the asterisks? is this some new macro i didn't get the memo on?
"{'items': **'**" + $.toJSON(paramList) + "**'**}"
try
"{'items': " + $.toJSON(paramList) + "}"
As i see it, you are already creating json. no need for the toJSON
try replacing the single quotes with double quotes. e.g.
'{"items": ' + paramList + '}'
your post data should look like this
'{
"items": [{
"id": "1",
"collapsed": "0",
"order": "0",
"column": "column2"
},
{
"id": "2",
"collapsed": "1",
"order": "1",
"column": "column2"
},
{
"id": "3",
"collapsed": "0",
"order": "0",
"column": "column3"
}]
}'
inline
'{ "items": [{ "id": "1", "collapsed": "0", "order": "0", "column": "column2" }, { "id": "2", "collapsed": "1", "order": "1", "column": "column2" }, { "id": "3", "collapsed": "0", "order": "0", "column": "column3" }]}'
var paramList = "";
if (paramArray.length > 0) {
for (var i = 0; i < paramArray.length; i ++) {
if (paramList.length > 0) paramList += ",";
paramList += '{"id":"' + paramArray[i].id + '",
"collapsed":"' + paramArray[i].collapsed + '",
"order":"' + paramArray[i].order + '",
"column":"' + paramArray[i].column + '"}';
}
}
paramList = "[" + paramList + "]";
$.ajaxSetup({ cache: false });
//Call the page method
$.ajax({
type: 'POST',
url: pagePath + '/' + fn,
contentType: 'application/json; charset=utf-8',
data: '{"items":' + paramList + '}', // the rest of your function is missing