Friday, May 6, 2011

controller parameter NULL when using JQuery POST and ASP.NET MVC

I have no problems processing JQuery GET requests in a controller, however I cannot get any form data to POST. The following client snippet:

//process result

combined with a controller:

public ActionResult Save(string name)
 return Json("Success!");

will result in a NULL value for the name parameter when inspected inside the action method, whereas I expected name to be mapped to the method parameter. Also all other objects (Request.Form) etc. in this context seem to be NULL. I can do this with a $.get but I think I am supposed to do any operations with side-effects with POSTs. I am using ASP.NET MVC 1.0, JQuery 1.2.6 and IE7.


Update: see my answer below and humble apologies

From stackoverflow
  • Could it be that the Save(string name) method is expecting stringified JSON? Try this:

    "{'name':'John'}", function(result){
    martijn_himself : unfortunately this doesnt work - thanks though!
  • It isn't so simple as making a json object and throwing it at an action.

    Start from here. People have written small scripts that get the JSON object dressed and ready for an action to read it in and map it to properties or arguments.

    martijn_himself : I'll read this; it seems though the link addresses how to pass JSON to action methods that expect complex custom types as parameters -which i'd like to do next!, but for now im simply trying to pass a string, which it seems should be straighforward - Thanks
    Mark Dickinson : Yeah, that's true. What is nice about passing JSON objects in is that you can write cool action filters to deserialize, and validate them. It's very good for AJAX with MVC. Hope it helps, thanks for your comment.
  • I believe your code should work, is your URL correct and your routes setup correctly? In addition you could always fire up Fiddler to see exactly what your request to the server is and if you are passing the correct items.

    martijn_himself : Thanks! ill try Fiddler. Ive used Web Development Helper in IE and it does seem to pass the right request body to the method.
  • Sorry guys, I had a $.ajaxSetup entry in the page which overrided the default contentType to application/json.

    When using the default contentType as follows:

    $.ajax({ url,
             type: "POST",
             contentType: "application/x-www-form-urlencoded",
             success: function(result) { alert(result); },
             data: { name: "John" }

    It works because processData is true by default which means the data entry with the JSON object will be parsed into a string (data: "name=John" also works).

    Sorry for wasting your time :) and thanks to Mark for the suggestion on passing JSON objects, ill do that next cause it seems very cool.

    Chuck Conway : Thanks for posting your fix.


Post a Comment