Posting JSON data to MVC controller using Ajax

Question

I've been trying to pass JSON data into MVC4 controller, which hasn't worked so far.

Also, I've googled on this a thousand of times.

The key point to solve this issue out there was to stringify the JSON object, define a model and get the parameter as the defined model, or define contentType.

I did those but defining a model for passing JSON into controller.

If I have to define the model every time I try to pass JSON parameter to server, I'm not going to build my app on MVC4, I will give up!

Is there another way to get JSON data from Ajax call in a controller without creating a model for the JSON data?

Here's my example code.

[HttpPost]
public ActionResult DATACRUD(string XmlParms)
{
 return Json(new{ data = XmlParms });
}
// Just example.

And Ajax call is.

$.ajax({
 type: "POST",
 url: "DATACRUD.json",
 data: JSON.stringify({data:"test"}),
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 async: false, //_async,
 success: function (result) {
 }
});

Ajax successfully invokes the action in a controller, but the parameter is null.

Please don't tell me defining model for the JSON parameter is the only one way to solve this issue.

It would be very frustrating if I have to do that.

---

UPDATE:

If I have to match the key name and the param name, I will give up as well.

JSON data usually looks like this in my app.

{
 "service": "COMMON",
 "method": "MENU_SUBLIST",
 "UID": "1000007",
 "ULID": "stackoverflow",
 "UNM": "queston", 
 "SITE": "1",
 "DEPT": "2",
 "LANG": "ko", 
 "MENUID": "0000",
 "STEPMENU": "",
 "ACTIONNAME": "" 
}

But the thing is that there're many kinds of JSON data including a variety of key names.

I cannot match the names all one by one. In this case, what should I do?

( And just make sure, wrapping the data like this below isn't a solution for me, there's a compatibility issue. )

{ XmlParms : { 
 "service":"COMMON",
 "method":"MENU_SUBLIST",
 "UID":"1000007",
 "ULID":"stackoverflow",
 "UNM":"queston",
 "SITE":"1",
 "DEPT":"2",
 "LANG":"ko",
 "MENUID":"0000",
 "STEPMENU":"",
 "ACTIONNAME":""
 }
}

• Kartikeya Khosla: what is "test" over here????
• Satpal: Have you tried JSON.stringify({XmlParms:"test"})?
• mohammadreza berneti: is correct action url in $.ajax ?
• anonymous: @mohammadrezaberneti Yes, it's correct. I set up in routeconfig for the url
• Jorge F: Is there another way to get JSON data from Ajax call in a controller without creating a model for the JSON data? Well if you need multiple parameters without a model, you cant define only one parameter string. The model it's the best way to bind every parameter. If you need a string, maybe the "object" you are trying to send, somehow convert it to a string a then you can control how to split them. But I think a model it's the best solution

Answer 1

you are missing the small thing. Parameter name should be the same in ajax call.

 data: JSON.stringify({XmlParms:"test"}),

• anonymous: sir, I updated my question. could you give me another solution? :(
• anonymous: Thanks a lot. matching the param name is the first thing I needed.

Answer 2

Firstly, the anonymous object syntax in your Action is incorrect; keys are given a value with =, not :.

[HttpPost]
public ActionResult DATACRUD(string XmlParms)
{
 return Json(new { data = XmlParms });
}

Secondly, your action is expecting a parameter called XmlParms, yet you are only sending a string in AJAX. Try this:

$.ajax({
 type: "POST",
 url: "DATACRUD.json",
 data: { XmlParms: "test" },
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 success: function (result) {
 console.log(result.data); // = 'test'
 }
});

Note that you don't need to manually use JSON.stringify as jQuery will do this for you when you give an object to the data property.

• anonymous: sir, I updated my question. could you give me another solution? :(
• Rory McCrossan: I'm sorry, I don't understand what your update means.

Answer 3

because your controller take argument named XmlParms, therefore in order to make it bind correctly, you must pass data with corresponding argument name

Assume that your json data will be assigned to a javascript variable name jsonParams. Then all you have to do is :

$.ajax({
 type: "POST",
 url: "DATACRUD.json",
 data: {XmlParms:jsonParams},
 contentType: "application/json; charset=utf-8",
 dataType: "application/xml-urlencode",
 async: false, //_async,
 success: function (result) {
 }
});

You just need to pass it as pure string, and parse it back to json object in your controller

• anonymous: sir, I updated my question. could you give me another solution? :(
• anonymous: appreciated it but, setting a default key name is not a solution for me. I have to accept the json data no matter what the key name is

Answer 4

I just remove (contentType: "application/json; charset=utf-8",) property from
$.ajax({ . . .

});

The action become recive data from ajax!