We Keep Coding

Deserialize from json string to list of dictionary?

I am passing array of json objects from ajax method.
var FieldValue = {
Key: $(this).attr("id"),
Value: $(this).val()
};
FieldValues.push(FieldValue);
$.ajax({
url: "../Handler.ashx?&Action=Save",
data: JSON.stringify(FieldValues),
type: "post",
datatype: "json",
contentType: "application/json; charset=utf-8",
});
But when i tried to deserialize to List of dictionary.
JavaScriptSerializer javaScriptSerializer = new JavaScriptSerializer();
List<Dictionary<string, string>> WebFields = new List<Dictionary<string, string>>();
WebFields = javaScriptSerializer.Deserialize<List<Dictionary<string, string>>>(jsonString);
My expected output list is like,
string Key = WebFields[0].Key
string Value = WebFields[0].Value
But now it is like each WebField item is like,
WebFields[0] -> [0] -> Key
[1] -> Value
How to achieve my expected output ?

To get a dictionary server side, try to send a basic POJO.
Instead of:
var FieldValue = {
Key: $(this).attr("id"),
Value: $(this).val()
};
FieldValues.push(FieldValue);
try:
var key = $(this).attr("id");
var value =$(this).val()
var fieldValue = { key: value };
fieldValues.push(fieldValue);
A javascript object is represented as a key value pair, thus returning a Dictionary will return a JS object with the key being propname, and value being the value

Ajax call to action with a List of KeyValuePairs as parameter

I wish to simply do an AJAX call to a method expecting a List of Key and value pairs, but I have no idea how to do this. I tried the following:
Server method:
UpdateBranches(List<KeyValuePair<string, string>> brancheItems)
data to be send:
var brancheItems = [];
businessActivities.forEach(f =>
brancheItems.push({
Key: f.sbiCode,
Value: f.sbiCodeDescription
})
This seemed to give me an array of objects with key and value properties. (network tab showed it), but it did not work. I also tried to make an array of objects with one property (propertyname is the key, value is the value):
for (var itemIndex in items[index].businessActivities) {
var key = items[index].businessActivities[itemIndex].sbiCode;
brancheItems.push({
key: items[index].businessActivities[itemIndex].sbiCodeDescription
});
}
Note that on the server I seem to receive an array/list of 3 items with two properties, but the properties are always empty. Does anyone know the correct format for the data to be send

I think you can simply create your object like this:
var ParamtersContainer = new Object();
ParamtersContainer = {
"PatientName": 'Alameer',
"ServiceDate": '12/12/2017',
"ProviderName": 'ahmed'
};
Then make it as data parameter in your ajax request, receive it as a dictionary in your c# action.

Use something like this.
$.ajax({
type: 'POST',
url: url,
contentType: "application/json",
data:JSON.stringify( {brancheItems: brancheItems}),
success: function (data) {
alert("Succeded");
}
});
And use the bracket notation:
Instead of brancheItems.push({ key : value });
use
var object = {};
object[key] = value;
brancheItems.push(object);

Ajax call is passing controller name and method name instead of data

I am running into some trouble with my ajax call. Here is the controller code:
[Route("RatingInfo/HandleRequest")]
[HttpPost]
public ActionResult HandleRequest(Dictionary<string, string> textBoxValues)
{
var result = CreateJson(textBoxValues); // This is a simplified example
return Json(result);
}
And here is my Jquery/ajax (Razor syntax):
function PassData () {
var data = {};
$('.divCell input').each(function (index, item) {
var id = $(item).attr('id');
var value = item.value;
data['dictionary[' + index + '].Key'] = id;
data['dictionary[' + index + '].Value'] = value;
});
$.ajax({
url: '#Url.Action("HandleRequest")',
type: 'POST',
dataType: 'JSON',
traditional: true,
data: data,
sucesss: function (result) {
alert('Success');
}
})
}
The idea here is to get the data from each textbox and pass it back to the server as a Dictionary with the id as the key and value as, well, the value.
Stepping through the Chrome debugger, the JS data object is built successfully.
From the debugger:
Local
data: Object
dictionary[0].Key: "Address"
dictionary[0].Value: "123 Main St"
dictionary[1].Key: "ZipCode"
dictionary[1].Value: "99999"
dictionary[2].Key: "Phone1"
dictionary[2].Value: "(555) 555-5555"
...
__proto__: Object
However, when the data is passed back to the controller, the values inside textBoxValues does not contain the passed data. Rather, it contains two key/value pairs with keys controller and action and values the names of the controller and action.
From the Visual Studio debugger:
textBoxValues = Count = 2
[0] = {[controller, RatingInfo]}
[1] = {[action, HandleRequest]}
How can I get Jquery to pass the data rather than the controller/action names? I am confused as to how this can even happen in the first place. Any help would be appreciated.

UPDATE
Sorry, I had put wrong code in.
The reason why this was not working is because the name of the parameter was incorrect, giving you a mismatch.
The below will work for you. Notice the name of dictionary is changed to your parameter textBoxValues:
function PassData() {
var data = {};
$('.divCell input').each(function (index, item) {
var id = $(item).attr('id');
var value = item.value;
data['textBoxValues[' + index + '].Key'] = id;
data['textBoxValues[' + index + '].Value'] = value;
});
$.ajax({
url: '#Url.Action("HandleRequest")',
type: 'POST',
traditional: true,
data: data,
sucesss: function (result) {
alert('Success');
}
})
}

How to pass a string array as a JSON argument

I'm trying to pass a couple of arguments to my JSON callback, however the string[] argument remains null. How do I need to pass the string array from javascript to get this working?
Javscript function:
function jsonCallback(jsonCallbackID, argumentsArray) {
var argumentValues = [];
for (var i = 0; i < argumentsArray.length; i++) {
argumentValues.push('' + $("#" + argumentsArray[i]).val());
}
// build request
var url = encodeURI("/DataEntry/JsonCallback/");
var data = ({ jsonCallbackID: jsonCallbackID, jsonCallbackValues: argumentValues, rndvalue: Math.floor(Math.random() * 10000000001) });
// fire request
$.getJSON(url, data, function (data) {});
The actual callback C# function:
public JsonResult JsonCallback(int jsonCallbackID, string[] jsonCallbackValues)
{ }
This function does get called however, argument 'jsonCallbackValues' is null.
EDIT
To get this working I did the following:
var data = ({ jsonCallbackID: jsonCallbackID, jsonCallbackValues: argumentValues.toString(), rndvalue: Math.floor(Math.random() * 10000000001) });
And split the jsonCallbackValues string at "," to get the resulting array.

You can give a try to JSON API ...
var data = {
jsonCallbackID:jsonCallbackID,
jsonCallbackValues: JSON.stringify(argumentValues),
rndvalue: Math.floor(Math.random() * 10000000001)
};
// your
$.getJSON(url, data, function (data) {});

JSON is a serialized language, so you can't put objects inside.
You should build your array in JSON format:
jsonCallbackValues : ["value1", "value2"...]

Try like this
var data = ({ jsonCallbackID: jsonCallbackID, jsonCallbackValues: $.toJSON(argumentValues), rndvalue: Math.floor(Math.random() * 10000000001) });
I have used a JSON jQuery plugin from http://code.google.com/p/jquery-json/
In the controller method change it to
string jsonCallbackValuesArray
Then use
JavaScriptSerializer orJSON.Net
to convert the JSON string into String []

Store with json reader is not working

I have following json created after I sereliaze a dictionary
{"Results":["{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}"],"Total":4}
When I try to load it into the extjs store , the store is not loaded
var store = Ext.create('Ext.data.Store', {
fields: fields,
pageSize: itemsPerPage,
proxy: {
type: 'ajax',
url: getDataWithPageURL,
reader: {
type: 'json',
root: 'Results',
totalProperty: 'Total'
}
}
});
But if I remove slash hard coded and it's working
{"Results":["{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD","TermCurrency":"JPY"}","{"BaseCurrency":"USD"}"],"Total":4}
I create json using Newtonsoft.Json
Dictionary<string, object> dict = new Dictionary<string, object>();
string s = JsonConvert.SerializeObject(dist);
How can I remove slash in server side in order to produce valid json for extjs store.
I tried
result = result.Replace("\"","'");
And
result =result.Replace("\"", #"""")
It's not working

Clearly, Ext doesn't like that you have encoded a json object as a string and then put them in another json object. You have two options that I see.
See if you can return the dict on the server-side without first converting it into a string. Some code, somewhere, is taking your string and putting it in a json object with 'Results' and 'Total'. Check to see if that code can take a Dictionary as-is.
Unwrap the 'Results' propery on the client-side. One way would be to make your own reader:
Ext.define('MyReader', {
extend: 'Ext.data.reader.Json',
alias: 'reader.my-json',
read: function(object) {
object.Results = Ext.Array.map(object.Results, Ext.decode);
return this.callParent([object]);
}
});
Then use type: 'my-json' in your reader config.
Here is my test case:
var data = {"Results":["{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}","{\"BaseCurrency\":\"USD\",\"TermCurrency\":\"JPY\"}"],"Total":4};
Ext.define('Currency', {
extend: 'Ext.data.Model',
fields: [
{ name: 'BaseCurrency', type: 'string' },
{ name: 'TermCurrency', type: 'string' }
]
});
Ext.define('MyReader', {
extend: 'Ext.data.reader.Json',
alias: 'reader.my-json',
read: function(object) {
object.Results = Ext.Array.map(object.Results, Ext.decode);
return this.callParent([object]);
}
});
var store = Ext.create('Ext.data.Store', {
model: 'Currency',
data: data,
proxy: {
type: 'memory',
reader: {
type: 'my-json',
root: 'Results',
totalProperty: 'Total'
}
}
});