asp.net - MVC4 IEnumerable 模型绑定(bind)始终为 null

Question

使用下面的代码，我的 IEnumerable bookingRooms 在到达 Controller 时始终具有空值，它知道我发回了多少个 bookingRooms，但对于每个项目，RoomID 和 NumRooms 的值始终为空，有什么想法吗？

我有以下 View 模型...

public class SelectDatesViewModel

    public int venueID { get; set; }
    public IEnumerable<BookedRoomViewModel> bookedRooms {get;set;}
    public string checkInDateString { get; set; }
    public int pageNo { get; set; }
    public bool showCheckIn { get; set;}
    public string startDateString { get; set; }
}
public class BookedRoomViewModel
{
    public string RoomID { get; set; }
    public string NumRooms { get; set; }
}

我正在使用以下 jquery ajax 调用..

function showArrivalCalendar() {
    showThrobber();
    var info = {
        venueID: venueID,
        bookedRooms: getBookedRooms(),
        startDateString: $("#calendarHolder").data("arrivalstartdate"),
        checkInDateString: "",
        pageNo: 1,
        showCheckIn: true
    }
    $.ajax({
        url: "/Booking/BookingCalendar/",
        type: "POST",
        data: JSON.stringify(info),
        dataType: "json",
        success: function (retValue) {
            $("#calendarHolder").html(data);
            hideThrobber();
        }
    });
}
function getBookedRooms() {
    var bookedRooms = [];
    $("#selectBookingType").find("select").each(function () {
         if ($(this).find(":selected").val() > 0) {
            var noRooms = $(this).find(":selected").val();
            bookedRooms.push({
                    RoomID: $(this).data("roomid"),
                    NumRooms: noRooms
            });
        };
    });
    return bookedRooms;
}

发布到此 Controller ..

[HttpPost]
public ActionResult BookingCalendar(SelectDatesViewModel model)
{
    return PartialView(GetBookingDates(model.venueID, model.startDateString, model.showCheckIn, model.pageNo, model.checkInDateString));
}

Answer 1

您的$.ajax调用选项是错误的:dataType用于指定您期望从服务器返回的数据类型，而不是数据的类型您发送到服务器。

如果您想要发送 JSON 数据并希望模型绑定(bind)器正常工作，则需要将 contentType 属性(请参阅 JQuery doc )设置为 "application/json" (您可能还需要JSON.stringify数据)

正确的用法是:

$.ajax({
    url: "/Booking/BookingCalendar/",
    type: "POST",
    data: JSON.stringify(info),
    contentType: "application/json",
    success: function (retValue) {
        $("#calendarHolder").html(data);
        hideThrobber();
    }
});