javascript - Passing int array to MVC controller - Stack Overflow

admin管理员组

文章数量:1336281

I have a JavaScript function where I pass 4 arrays, each of these is of the type [1, 2] with only int values inside or [] with no values inside. these are passed into an Url.Action mand.

function Filter(locations, machines, severities, messages) {
    var url = '@Url.Action("Filter", "ActiveMessages")?' + $.param({ 
        locations: locations, machines: machines, severities: severities, messages: messages });
    $.ajax({
        url: url,
        method: 'POST',
        traditional: true,
        success: function (data) { }
    });
}

I tried to build the parameters using $.param(). but this doesn't generate the parameters i'm expecting, I get something like this: "/ActiveMessages/Filter?locations%5B%5D=1"

I also tried doing this:

decodeURIComponent($.param({ locations: filterlocations, machines: filtermachines, severities: filterseverities, messages: filtermessages }))

Then I get something like this: "/ActiveMessages/Filter?locations[]=1&locations[]=2"

Are there any other ways to parse such an array into an url?

Receiving happens in the controller:

public async Task<ActionResult> Filter(int[] locations, int[] machines, int[] severities, int[] messages)
{
    //TODO filter
}

This gets called but the parameters are null;

when I started out I used this which works for a single value but needs to be extended to an array.

var url = '@Url.Action("Filter", "ActiveMessages")' + '?locations=' + locations + '&machines=' + machines + '&severities=' + severities + '&messages=' + messages;

I have a JavaScript function where I pass 4 arrays, each of these is of the type [1, 2] with only int values inside or [] with no values inside. these are passed into an Url.Action mand.

function Filter(locations, machines, severities, messages) {
    var url = '@Url.Action("Filter", "ActiveMessages")?' + $.param({ 
        locations: locations, machines: machines, severities: severities, messages: messages });
    $.ajax({
        url: url,
        method: 'POST',
        traditional: true,
        success: function (data) { }
    });
}

I tried to build the parameters using $.param(). but this doesn't generate the parameters i'm expecting, I get something like this: "/ActiveMessages/Filter?locations%5B%5D=1"

I also tried doing this:

decodeURIComponent($.param({ locations: filterlocations, machines: filtermachines, severities: filterseverities, messages: filtermessages }))

Then I get something like this: "/ActiveMessages/Filter?locations[]=1&locations[]=2"

Are there any other ways to parse such an array into an url?

Receiving happens in the controller:

public async Task<ActionResult> Filter(int[] locations, int[] machines, int[] severities, int[] messages)
{
    //TODO filter
}

This gets called but the parameters are null;

when I started out I used this which works for a single value but needs to be extended to an array.

var url = '@Url.Action("Filter", "ActiveMessages")' + '?locations=' + locations + '&machines=' + machines + '&severities=' + severities + '&messages=' + messages;

• javascript
• arrays
• asp-mvc

Share Improve this question Follow edited Dec 31, 2017 at 11:09 Milad Rashidi 1,37644 gold badges2323 silver badges4040 bronze badges asked Feb 23, 2017 at 13:55 Axel BouttelgierAxel Bouttelgier 17311 silver badge1212 bronze badges 5

• Why do you want to pass them by URL? – Ivan Franco Commented Feb 23, 2017 at 13:58
• what other way would you remend? i thought it would be the easiest way since the data isn't private – Axel Bouttelgier Commented Feb 23, 2017 at 13:59
• 2 I suggest to pass them with an AJAX POST and include all arrays on data property. Something like this stackoverflow./a/5489534/6157222 – Ivan Franco Commented Feb 23, 2017 at 14:02
• Yes. Just use POST. You should pretty much always use POST with an AJAX call involving data. – Chris Pratt Commented Feb 23, 2017 at 14:26
• 1 If you did want to do this as a query string, then you need to use $.param({ ..... }, true); - your missing the 2nd parameter - refer documentation (and the traditional: true option would be pointless since you not sending any data in the body – user3559349 Commented Feb 23, 2017 at 21:48

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

best practise for a post action will be to use the body to send parameters for post (Note the [FromBody] annotation of paramters):

[HttpPost]
public async Task<ActionResult> Filter([FromBody] int[] locations, [FromBody] int[] machines, [FromBody] int[] severities, [FromBody] int[] messages)

the parameters needs to be specified in the body of the ajax call:

function Filter(locations, machines, severities, messages) {
     var url = '@Url.Action("Filter", "ActiveMessages")';
     $.ajax({
          url: url,
          method: 'POST',
          data: JSON.stringify({ locations: locations, machines: machines, severities: severities, messages: messages }),
          traditional: true,
          success: function (data) {
     }});
 }

var locations = [1,2];
var machines = [3,4];
var severities = [5,6];
var messages = [7,8];

$.ajax({
     url: @Url.Action("Filter", "ActiveMessages"),
     method: 'POST',
     data: { 
            locations: locations, 
            machines: machines, 
            severities: severities, 
            messages: messages 
     },
     success: function (data) {
     }
});

In this case, no need to stringify :)

While what the others say is totally true (body is made for that) sometimes it's still good to have a choice. The Problem with your query was that the keyword machines= (or locations etc.) must be repeated for each array value. Something like this would work:

const machines = [1, 2];
const locations = [3, 4];

function formatParamArray(array, name) {
  return `${name}=` + array.reduce((acc, cur) => `${acc}&${name}=${cur}`);
}

var url = '@Url.Action("Filter", "ActiveMessages")?'+formatParamArray(machines, 'machines')+'&'+formatParamArray(locations, 'locations');

本文标签： javascriptPassing int array to MVC controllerStack Overflow