My issue arises from encountering an empty array of objects at the backend. To illustrate, I have established two classes at the backend...
public class ScoreModel {
public string Subject { get; set; }
public float Score { get; set; }
}
public class StudentTestModel
{
public string Name { get; set; }
public ScoreModel[] Scores { get; set; }
}
Within the above code snippet, the StudentTestModel class possesses an array of ScoreModel with two simple data attributes. Subsequently, in the frontend, I utilize the jQuery library to interact with the backend in this manner...
$("#btnCountScore").click(function () {
var frm = new FormData();
frm.append("Name", "Garfield");
var r = [
{ "Subject": "Chinese", "Score": 89 },
{ "Subject": "English", "Score": 87 },
{ "Subject": "Math", "Score": 76 },
{ "Subject": "NaturalScience", "Score": 90 },
{ "Subject": "SocialScience", "Score": 83 },
];
var r_form = [];
for (var i = 0; i < r.length; i += 1) {
var f = new FormData();
f.append("Subject", r[i].Subject);
f.append("Score", r[i].Score);
r_form.push(f);
}
frm.append("Scores", r_form);
$.ajax({
url: "../Home/CountScore",
method: "post",
processData: false,
contentType: false,
data: frm,
success: function (ret) {
$("#lblShowAverage").text(ret);
}
});
});
During debugging, while the Name field contains value, the Scores array arrives as empty at my backend, hence impeding me from achieving desired results. Is there any guidance available on rectifying this scenario?