Jquery Ajax Call to Controller Action Passing Array of Values

jQuery AJAX call to Controller action passing array of values

I would suggest not changing default option values unless you need.
Create you parameters as a JSON object and pass it to $.ajax.

From jQuery API for AJAX

processData (default: true)

Type: Boolean

By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

Setting this value to false will cause problems when attempting to pass more than one value to the action unless you do the processing within the controller function.

var action = $("#PrintProjectFormId").attr("action");

//fill projects array

$.ajax({
type: "POST",
url: action,
data: {
projectId: $("#PrintProjectFormId").val(),
"projects": projects
},
success: function(result) {
//stuff I'll get to later
},
error: function(jqXHR, textStatus, errorThrown) {
alert("There was a problem retrieving this project");
}
});

Passing array of objects to Controller Action using jQuery ajax request using .NET Core 2.2 doesn't work

[Edit]
Change the js as below:

    function toInt(str){
var i = parseInt(str);
return i ? i : 0;
}

$("#MarksTable tbody tr").each(function () {

var obj = {};
obj.StudentID = 1;
obj.ExamTimeTableID = 1;
obj.ClassActivity = toInt( $(this).find("td:eq(5) input").val());
obj.IsPresent =toInt( $(this).find("td:eq(7) input").val());
obj.Assignment = toInt( $(this).find("td:eq(6) input").val());
obj.MidTerm =toInt( $(this).find("td:eq(3) input").val());
obj.Final = toInt( $(this).find("td:eq(4) input").val());

datalist.push(obj);
});

This will make sure the empty input to 0 instead of null.


That's because on your server side you're declaring the ClassActivity/ClassActivity/Assignment/... as int type but your js send all them as string. For example, the Payload sent to server will be something like:

[{"StudentID":1,"ExamTimeTableID":1,"ClassActivity":"3","Assignment":"aa","MidTerm":"333333333","Final":"3333"},{"StudentID":1,"ExamTimeTableID":1,"ClassActivity":"","Assignment":"s","MidTerm":"2","Final":"1"},{"StudentID":1,"ExamTimeTableID":1,"ClassActivity":"3","Assignment":"","MidTerm":"2","Final":"1"}]

Please either change the property type or convert the $(this).find("td:eq(7) input").val() result (a string) to int/bool/... type before sending them.

Passing array via Ajax to MVC Action

This is what worked on my end:

jQuery ajax method:

$.ajax({
contentType: "application/json; charset=utf-8",
dataType: 'json',
type: 'POST',
url: '@Url.Action("MonthsToAdd")',
data: JSON.stringify(months),
success: function (response) {
alert("success.");
}
});

Controller action:

[HttpPost]
public async Task<IActionResult> MonthsToAdd([FromBody] List<string> months)

{
// Add [FromBody]
}

passing an array from ajax call to controller, array empty in controller

This variant was tested using postman body json -
["GroupId-1","SubGroupId-2","changed"]

Change your ajax data to this:

data:  list,

and your controller action:


public string UpdateMemberToGroup([FromBody] []string list)
{
var memberGroups = new MemberGroups
{
GroupId =list[0],
SubGrouId =list[1],
Status =list[2]
};
// save records
}

This variant was tested in postman using
{"GroupId":"GroupId-1","SubGroupId": "SubGroupId-2", "Status":"changed"}

you can put the code in javascript:

var data={GroupId:list[0],SubGroupId:list[1], Status:list[2]}

......
....

data:data,
.....

your controler action in this case:

public string UpdateMemberToGroup([FromBody] MemberGroups memberGroups)
{
// save records
}

And I don't know what version MVC you use , but for some versions instead of [FromBody] better to use [FromForm] or don't use anything at all.

How pass int array from jquery ajax to asp.net mvc action

If you want to send values using traditional encoding then you shouldn't JSON encode the data you're sending. As such, remove the JSON.strigify() call, as well as the contentType. Try this:

$.ajax({
url: url,
type: 'POST',
dataType: "json",
traditional: true,
data: { ids: values }
});

Ajax not passing array to Controller Action?

You are trying to send a complex object with GET method. The reason this is failing is that GET method can't have a body and all the values are being encoded into the URL.

Similar Question

Complex type is getting null in a ApiController parameter

I Would just join the Multiselectfilter in client and split them in server side