MVC4 IEnumerable模型绑定总是为空

Question

使用下面的代码我IEnumerable的预订房间总是有空值，当他们到达控制器时，它知道有多少个已预订房间我送回，但是RoomID和NumRooms的值对于每个项目都是空的想法？

我有以下视图模型...

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; 
} 

要在这个控制器..

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

Answer 1

您的$.ajax调用选项有误：dataType用于指定dat的类型您希望从服务器返回的数据不是您发送到服务器的数据类型。

你需要的，如果你想发送JSON数据来设置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(); 
    } 
});