5

I'm having difficulty posting a JavaScript object via jQuery to a .net MVC 3 controller.

My object:

var postData = {
    'thing1' : "whatever",
    'thing2' : "something else",
    'thing3' : [1, 2, 3, 4]
}

My jQuery Call:

$.post('<%= Url.Action("Commit", "MassEdit") %>', postData, function (data) {
    // stuff
});

My View Model:

public class SubmitThing {
    public string thing1 { get; set; }
    public string thing2 { get; set; }
    public IEnumerable<int> thing3 { get; set; }
}

My controller:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Commit(SubmitThing changes)
{
    return new EmptyResult();
}

The problem is that my 'changes' object that I have within my controller have thing1 equal to "whatever", thing2 equal to "something else", but thing3 is null. Now do I get thing3 to be my list of integers?

Added: I think this is more of a mapping issue than a serialization issue. In my controller, if I look at

HttpContext.Request.Form["thing3[]"]

I get a string with the value of "1,2,3,4". But again, I'd like the mapping to just work.

Thanks!

3 Answers 3

6

Just post it as json:

    $.ajax({
        url: '<%= Url.Action("Commit", "MassEdit") %>',
        type: 'POST',
        dataType: 'json',
        data: JSON.stringify({'thing1' : "whatever",
    'thing2' : "something else",
    'thing3' : [1, 2, 3, 4]
}),
        contentType: 'application/json; charset=utf-8',
        success: function (data) {

        }
    });

and it should work

Sign up to request clarification or add additional context in comments.

3 Comments

Is the MVC stuff designed to receive JSON in the request? Also, that post, as written, won't work. If you give it an object for data, jQuery always does URL-encoding on it, regardless of the contentType you specify. If you use a custom contentType, you have to serialize it yourself (e.g., JSON.stringify or similar) and specify data as a string. And you've given dataType: 'json' in your request, but that controls the type of what you're expecting back, not the type of what you're sending (despite the very confusing naming similarity with data).
yes you are right you have to stringify it, asp.net mvc 3 can receive json out of the box, the datatype json specifies the type you are expecting to get back from the server you can change it to whatever you will return, the contenttype specifies what you are sending to the server. I edited the post.
Good deal, that's cool if MVC 3 can receive it. I'd remove the dataType from the example to avoid confusing people.
0

Hi why don't you join the values before passing them?

var thing3 = [1, 2, 3, 4];

thing3 = thing3.join(',');

var postData = {
    'thing1' : "whatever",
    'thing2' : "something else",
    'thing3' : thing3 
}

otherwise i think you have to use the $.ajax function to have it serialaize the array

5 Comments

A bit of a hack, isn't it? Then he has to massage the data at the other end, rather than getting the nice mapping stuff the MVC gives him.
@T.J. Crowder yes it's an hack, i don't know anything about MVC3, but to have the array serialized you have to send the request with a parameter set and i don't think that parameter (traditional) is set when using the shortand $.POST
Yeah, this is my backup plan, but it would be nice if MVC did it for me. (which it should)
I don't have serialization problems getting it to the server. If I look at HttpContext.Request.Form["thing3[]"] I get "1,2,3,4". But again, I'd like the mapping to just work.
@Erik W Sorry i didn't understand that! :)
0

I'm doing something similar in a web forms project, but I'm using List<int> instead of IEnumberable<int> (edit to add:) And it's working... ;)

EDIT 2 :

Looking farther at what we're doing different. Could you try building your object slightly differently and using JSON.stringify()? The following is a bit closer to what's working for me...

var postData = JSON.stringify({
    thing1 : "whatever",
    thing2 : "something else",
    thing3 : [1, 2, 3, 4]
});

5 Comments

I couldn't get that to work. I tried IEnumerable, IList, an even int[] thing3, and nothing.
@T.J. List does implement IList? msdn.microsoft.com/en-us/library/6sh2ey19.aspx Or am I missing something? Regardless, that doesn't work either.
@Erik: Sorry, I was thinking of LinkedList, not List.
@Erik: Which didn't work? the List<int> alone, or did you change your object as i suggested in the edit... I see you accepted the other answer, which makes a similar change to the object, but I'm curious to know if you left it IEnumerable<int> or not...
@ShaneBlake: I left it at IEnumerable<int>. The ultimate problem was that the jquery $.post was posting the individual properties like a form (so it was sending four "thing3[]"s), and the solution just posted a single json string, which .net mvc 3 apparently understood better.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.