返回复杂类型以使用 AJAX 查看

Question

我想要做什么。

我有一个由 EF 从存储过程生成的复杂类型。它返回 GetAvailableRooms_Results 列表。我希望用户选择 2 个日期，然后返回存储过程返回的可用房间列表（复杂类型）。

我不是 100% 确定我是否需要将复杂类型返回给我愿意通过使用 Ajax.Begin Form、Ajax.Action Link 或难以理解的 ajax 和 jquery 来解决这个问题......我已经尝试过了并且每次都因不同的原因而失败。

我找不到使用 Ajax 返回复杂类型的示例。此外，我通常在使用 JavaScript 而不是发布问题时遇到困难，但是最后的屏幕截图让我在这里提出问题......因为我认为它与 JavaScript 无关。

我的代码

存储过程 - GetAvailableRooms

declare @arrive as datetime, @depart as datetime
set @arrive = '2013/11/29'
set @depart = '2013/12/01'

SELECT  Room.Name, Format(Reservation.StartDate,'D') AS 'Date', 
        (Room.Capacity) - (Count(Reservation.StartDate)) AS Available, 
        Count(RoomReservation.RoomId) AS 'Reservations', Room.Gender 
FROM    Room
        FULL JOIN RoomReservation 
        ON RoomReservation.RoomId = Room.RoomId 
        FULL JOIN Reservation 
        ON Reservation.ReservationId = RoomReservation.ReservationId
        WHERE StartDate BETWEEN @arrive AND @depart
GROUP BY Room.Capacity, Room.Gender, Room.Name, Reservation.StartDate, 
         Reservation.EndDate 

复杂类型（存储过程结果）GetAvailableRooms_Result

public partial class GetAvailableRooms_Result
{
    public string Name { get; set; }
    public Nullable<int> Available { get; set; }
    public Nullable<int> Reservations { get; set; }
    public Nullable<System.DateTime> Date { get; set; }
    public Nullable<bool> Gender { get; set; }
}

从 Reservation/Index.cshtml 调用存储过程 GetAvailableRooms

 @Html.ActionLink("Available Rooms", "Index",
            controllerName: "GetAvailableRooms_Result",
            routeValues: new { arrive = item.StartDate, depart = item.EndDate },
            htmlAttributes: item.StartDate)

我尝试过的

我尝试使用 Ajax.ActionLink 将复杂类型的部分视图中的结果返回到我从中调用它的页面。像这样……

    @using Skimos.Models
@model List<ReservationIndexViewModel>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table class="table table-striped">
    <tr>
        <th>
            Room Name
        </th>
        <th>
            Arrival Date
        </th>
        <th>
            Depart Date
        </th>
        <th>
            Member Id
        </th>
        <th>
            Price
        </th>
        <th>
            Rooms
        </th>
        <th></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
        <td>
            @Skimos.Services.HtmlHelpers.RoomName(item.RoomId)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.StartDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.EndDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Price)
        </td>
            <td>
                @Html.ActionLink("Meals", "AvailableMeals",
            new { arrive = item.StartDate, depart = item.EndDate })
            </td>
            <td>
                @Html.ActionLink("Available Rooms", "Index",
                "GetAvailableRooms_Result",
            new { arrive = item.StartDate.Date, depart = item.EndDate.Date }, 
                 item.StartDate.Date)//<-- this was just required for the 
                                                 overload I also tried it as null.

            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { id=item.ReservationId }) |
                @Html.ActionLink("Details", "Details", new { id=item.ReservationId }) |
                @Html.ActionLink("Delete", "Delete", new { id=item.ReservationId })
            </td>
        </tr>
    }
</table>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/Bootstrap-datepicker")
    @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
    <script type="text/javascript">
        $('.datepicker ').datepicker({
            weekStart: 1,
            autoclose: true,
            todayHighlight: true,
        });
        </script>
}

我也试过用

我为复杂类型创建了一个控制器，并使用 Ajax.Beginform 来返回存储的复杂类型的部分视图。

使用 Skimos.Models @model 列表 @{ ViewBag.Title = "开始预订"; }

<h2>StartReservation</h2>


@using (Ajax.BeginForm("AvailableRooms", new AjaxOptions 
{ HttpMethod = "Get", UpdateTargetId = "rooms", 
OnFailure = "searchFailed", OnSuccess = "data" }))

{
    <input class="datepicker" id="StartDate" 
name="StartDate" tabindex="1" type="text" value="">

<input class="datepicker" id="EndDate" 
name="EndDate" tabindex="1" type="text" value="">

   <input type="submit" class="btn-warning" />
    <div id="rooms">
    </div>
      }


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/Bootstrap-datepicker")
    @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
  }
<script type="text/javascript">

    $('.datepicker').datepicker({
        weekStart: 1,
        autoclose: true,
        todayHighlight: true,
    });

function searchFailed() { $("#availableRooms").html("Search failed."); }
</script>

把我推到边缘的错误

最后一次尝试

下面是我尝试在局部视图中返回复杂类型的 ActionResult。

 public ActionResult AvailableRooms(DateTime arrive, DateTime depart)
        {
            var rooms = db.GetAvailableRooms(arrive, depart);
            return PartialView("AvailabeRooms", rooms.ToList());
        }

返回此错误： 参数字典包含方法 'System.Web.Mvc.ActionResult AvailableRooms(System. “Skimos.Controllers.ReservationController”中的 DateTime、System.DateTime)”。可选参数必须是引用类型、可空类型或声明为可选参数。

Answer 1

看起来您正在将日期格式化为存储过程中的字符串。 EF 正在尝试将此字符串值设置为 Date? 字段 (Nullable<System.Date>)，而该字段不接受字符串。

导致问题的存储过程：

SELECT  Room.Name, Format(Reservation.StartDate,'D') AS 'Date', -- <-- this is formatting as a string, not a datetime.
    (Room.Capacity) - (Count(Reservation.StartDate)) AS Available, 
    Count(RoomReservation.RoomId) AS 'Reservations', Room.Gender  --...

将您的 GetAvailableRoomsResult 对象更改为如下所示：

public partial class GetAvailableRooms_Result
{
    public string Name { get; set; }
    public Nullable<int> Available { get; set; }
    public Nullable<int> Reservations { get; set; }
    public String Date { get; set; } // <-- change is here.
    public Nullable<bool> Gender { get; set; }
}