How to pass array from Javascript to controller's action?

Question

I have JS function like this inside the @section Scripts of .cshtml view:

function SendIndexes() {
                    var selectedSortOption = $("#SortBy").find('option:selected');
                    var sortIndex = selectedSortOption.val();

                    var selectedFilterByTypeOption = $("#filter_marker_bytype").find('option:selected');
                    var filterByTypeIndex = selectedFilterByTypeOption.val();

                    var selectedFilterByScoreOption = $("#filter_marker_byscore").find('option:selected');
                    var filterByScoreIndex = selectedFilterByScoreOption.val();
                    

                    var selectedFilterByStatusOption = $("#filter_marker_bystatus").find('option:selected');
                    var filterByStatusIndex = selectedFilterByStatusOption.val();

                    var markerFilterIndexes = [filterByTypeIndex, filterByScoreIndex, filterByStatusIndex];


                    location.href = `/Markers/[email protected]&sortIndex=${sortIndex}&markerFilterIndexes=${markerFilterIndexes}`
                }

and the controller action signature like this:

public async Task<IActionResult> MarkersList(List<string> markersForUpdateIds, IEnumerable<int> markerFilterIndexes, int page = 1, string message = "", int sortIndex = 0)
{
...
}

The problem is that the array of three elements is not passed at all. However, if I only push a single variable (element) to this array, then it is passed to the controller's action as it should.

Why is this happening and how to have all three elements passed to the controller?

Does this answer your question? Url.Action Passing string array from View to Controller in MVC# — Heretic Monkey
– Heretic Monkey, Commented Oct 20, 2020 at 2:06

Augusto Sanchez · Accepted Answer · 2020-10-20 01:53:16Z

0

I'll suggest you to use [FromQuery] attribute in your parameter and format your URL like this: myparam=myvalue1&myparam=value2&myparam=myvalue3.

public async Task<IActionResult> MarkersList([FromQuery]List<string> markersForUpdateIds, [FromQuery]IEnumerable<int> markerFilterIndexes, [FromQuery]int page = 1,[FromQuery] [FromQuery]string message = "", [FromQuery]int sortIndex = 0)
{
...
}

Take a look of ModelBinding: https://learn.microsoft.com/en-us/aspnet/core/mvc/models/model-binding?view=aspnetcore-3.1#sources

answered Oct 20, 2020 at 1:53

Augusto Sanchez

1,1791 gold badge8 silver badges14 bronze badges

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

Comments

mj1313 · Accepted Answer · 2020-10-20 02:55:59Z

0

For passing an array to the controller action. Data formats that use subscript numbers (... [0] ... [1] ...) must ensure that they are numbered sequentially starting at zero. Here you don't need to define an array, just format your url like this:

location.href = `/Markers/[email protected]&sortIndex=${sortIndex}&markerFilterIndexes[0]=${filterByTypeIndex}&markerFilterIndexes[1]=${filterByScoreIndex}&markerFilterIndexes[2]=${filterByStatusIndex}`

Since the data in the array is just int type data, you can omit the subscript numbers.

edited Oct 20, 2020 at 2:55

answered Oct 20, 2020 at 2:17

mj1313

8,5172 gold badges17 silver badges34 bronze badges

Collectives™ on Stack Overflow

How to pass array from Javascript to controller's action?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related