Sending Array to ASP.NET MVC Model through JQuery Ajax
I am trying to send a model to ASP.NET MVC controller action, but for some reason do i not get the array along properly.
The Javascript code, the array is "Days"
var days = [];
var i = 0;
$('input[name="Days[]"]:checked').each(function(){
days[i] = $(this).val();
i++;
});
var postData = {
listId: listId,
Quantity: $('select[name="@Html.NameFor(x=> x.Quantity)"]').val(),
Item: $('input[name="@Html.NameFor(x=> x.Item)"]').val(),
RepeatingType: $('select[name="@Html.NameFor(x=> x.RepeatingType)"]').val(),
IntervalDaily: $('select[name="@Html.NameFor(x=> x.IntervalDaily)"]').val(),
IntervalWeekly: $('select[name="@Html.NameFor(x=> x.IntervalWeekly)"]').val(),
IntervalMonthly: $('select[name="@Html.NameFor(x=> x.IntervalMonthly)"]').val(),
IntervalYearly: $('select[name="@Html.NameFor(x=> x.IntervalYearly)"]').val(),
Days: days,
Time: $('input[name="@Html.NameFor(x=> x.Time)"]').开发者_Go百科val(),
StartsOn: $('input[name="@Html.NameFor(x=> x.StartsOn)"]').val(),
EndType: $('select[name="@Html.NameFor(x=> x.EndType)"]').val(),
EndsOn: $('input[name="@Html.NameFor(x=> x.EndsOn)"]').val(),
EndOccurrences: $('select[name="@Html.NameFor(x=> x.EndOccurrences)"]').val()
};
alert(postData.Days);
$.ajax({
type: "POST",
url: "/List/AddRepeatingItem/",
dataType: "json",
data: postData,
success: function(data) {
if (data) {
alert("Success");
}
}, error: function(xhr, status, error) {
DisplayError("Error!!! " + xhr);
}
});
return false;
The model i am trying to send
public class NewRepeatingItemModel
{
[Required]
[DisplayName("Quantity")]
[Integer]
public int Quantity { get; set; }
[Required]
[DisplayName("Item")]
[StringLength(50, MinimumLength = 3, ErrorMessage = "Item name can not be less then 3 or greater then 50")]
public string Item { get; set; }
[Required]
[DisplayName("Type")]
public int RepeatingType { get; set; }
[DisplayName("Repeat every")]
public int IntervalDaily { get; set; }
[DisplayName("Repeat every")]
public int IntervalWeekly { get; set; }
[DisplayName("Repeat every")]
public int IntervalMonthly { get; set; }
[DisplayName("Repeat every")]
public int IntervalYearly { get; set; }
[DisplayName("Repeat on")]
public IList<int> Days { get; set; }
[Required]
[DisplayName("Time")]
public TimeSpan Time {get; set;}
[DisplayName("Starts On")]
[DataAnnotationsExtensions.Date]
public DateTime StartsOn {get; set;}
[Required]
[DisplayName("End Type")]
public int EndType { get; set; }
[DisplayName("Ends On")]
public DateTime EndsOn {get; set;}
[DisplayName("Occurrences")]
public int EndOccurrences { get; set; }
}
And the action
public JsonResult AddRepeatingItem(int listId, NewRepeatingItemModel model)
{
What can i do to get the Days alog properly? I have tested the array by doing a alert(postData.Days) and that alerts "1,5"
You could use a JSON request:
$.ajax({
type: "POST",
url: "/List/AddRepeatingItem/", // <-- never hardcode urls like this or this code might bite you very badly once you ship
contentType: 'application/json; charset=utf-8',
dataType: "json",
data: JSON.stringify(postData),
success: function(data) {
if (data) {
alert("Success");
}
},
error: function(xhr, status, error) {
DisplayError("Error!!! " + xhr);
}
});
Notice the following modifications to your AJAX request:
Set a JSON request content type:
contentType: 'application/json; charset=utf-8'
Send JSON:
data: JSON.stringify(postData)
The JSON.stringify
method is natively implemented in modern browsers. For all the other legacy stuff you need to include json2.js.
Set the traditional setting of the ajax request to true:
$.ajax({
type: "POST",
url: "/List/AddRepeatingItem/",
dataType: "json",
traditional: true, //###THIS SETTING
data: postData,
success: function(data) {
if (data) {
alert("Success");
}
},
error: function(xhr, status, error) {
DisplayError("Error!!! " + xhr);
}
});
try setting contentType: 'application/json'
in your $.ajax()
call.
精彩评论