jQuery Ajax POSTing array to ASP.NET MVC Controller

Question

I'm missing something here. I've got this jQuery JavaScript:

$.ajax({
    type: "POST",
    url: "/update-note-order",
    dataType: "json",
    data: {
        orderedIds: orderedIds,
        unixTimeMs: new Date().getTime()
    }
});

Where orderedIds is a JavaScript number array (e.g. var orderedIds = [1, 2]).

The handling Controller method is:

[HttpPost]
public void UpdateNoteOrder(long[] orderedIds, long unixTimeMs)
{
    ...
}

When I put a Debugger.Break() in UpdateNoteOrder(), orderedIds is null in the Watch window. (unixTimeMs, however, has a numeric value.)

How do I pass the number array through $.ajax() such that orderedIds is a long[] in my controller?

Check this: http://www.codingfusion.com/Post/Passing-an-Array-to-MVC-Action-via-AJAX — MaxPayne, Aug 22 '23 at 04:13

score 125 · Accepted Answer · answered Dec 09 '10 at 19:09

125

Just set the traditional parameter to true:

$.ajax({
    type: "POST",
    url: "/update-note-order",
    dataType: "json",
    traditional: true,
    data: {
        orderedIds: orderedIds,
        unixTimeMs: new Date().getTime()
    }
});

Since jquery 1.4 this parameter exists because the mechanism to serialize objects into query parameters has changed.

answered Dec 09 '10 at 19:09

Darin Dimitrov

1,023,142
271
3,287
2,928

Unfortunately in my Rails application, I get only last element of the array. I verified that browser is sending array correctly. In above example, I replaced `orderedIds: orderedIds` with `'orderedIds[]': orderedIds` to make it work for Rails. – Amit Patel Aug 28 '12 at 11:27
1

Great one. Instead of using Viewmodel for a simple string array, traditional true does it. upvoted ! – Sakthivel Sep 25 '13 at 06:39
I've spent an unbelievable amount of time trying to figure out this issue in my code and I stumbled across this gem. Thanks for your help. – Jeremy Feb 14 '15 at 16:08

score 0 · Answer 2 · answered Dec 09 '10 at 19:08

0

you'll need to turn orderedId's into a param array, or the controller won't see it

$.param({ orderedIds: orderedIds });

in your code:

$.ajax({
    type: "POST",
    url: "/update-note-order",
    dataType: "json",
    data: {
        orderedIds: $.param({ orderedIds: orderedIds }),
        unixTimeMs: new Date().getTime()
    }
});

answered Dec 09 '10 at 19:08

Jeremy B.

9,168
3
45
57

2

This does not work. In UpdateNoteOrder, orderedIds is still null. – AgileMeansDoAsLittleAsPossible Dec 09 '10 at 19:19
if it doesn't work, check your code first, this is taken directly from the jquery documentation http://api.jquery.com/jQuery.param/ You may want to be sure you are correct before rejecting an answer – Jeremy B. Dec 09 '10 at 19:22
I can confirm also that this doesn't work (I wrote a sample application in order to test it). – Darin Dimitrov Dec 09 '10 at 19:23
1

I tested with 1.3.2, I see now the changes were in 1.4. I guess I didn't update jquery recently. – Jeremy B. Dec 09 '10 at 19:28
in jquery 1.3.2 you don't even need `$.param`, it will work out of the box. Unfortunately in jquery 1.4 this behavior has changed. – Darin Dimitrov Dec 09 '10 at 19:29
Perhaps best to just remove this answer? – Chris F Carroll Feb 27 '15 at 12:55

jQuery Ajax POSTing array to ASP.NET MVC Controller

2 Answers2

Linked

Related