3

我有一个小问题。

我的行动是：

 public ViewResult SearchForRooms(int HotelDDL) 
    {

        List<Room> roomsInHotel = bl.ReturnRoomsPerHotel(HotelDDL);

        return View(roomsInHotel);
    }

这是调用该操作的 jquery：

<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        $("#HotelDDL").change(function () {

            var text = $("#HotelDDL option:selected").text();
            var value = $("#HotelDDL option:selected").val();
            alert("Selected text=" + text + " Selected value= " + value);

            $.post("/Home/SearchForRooms",
            {
                HotelDDL: $("#HotelDDL option:selected").val() 
            });
        });
    });
</script>

最后，这是应该调用的视图：

@model IEnumerable<RoomReservation.Entities.Entities.Room>

@{
    ViewBag.Title = "Search";
}

<h2>Result</h2>

<table>
    <tr>
        <th>
            City
        </th>
        <th>
            Hotel
        </th>
        <th>
            Room label
        </th>
        <th>
            Number of beds
        </th>
        <th>
            Price per night
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelitem=>item.Hotel.City.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Hotel.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.NumberOfBeds)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.PricePerNight)
        </td>
    </tr>
}
</table>

除最终视图渲染外，一切正常（数据库正确返回所有房间）。我试过菲尔的工具，但它没有给我任何可疑的提示：

RouteDebug.RouteDebugger.RewriteRoutesForTesting(RouteTable.Routes);

那么，为什么在 jscript 发送它的 post 方法后它没有显示SearchForRooms()呢？谢谢

PS如果您需要任何其他代码，请直接说出来。

4

1 回答 1

3

请注意，执行 ajax 帖子不会像经典帖子那样刷新或重定向页面。

该视图未显示，因为没有放置它的位置。您成功发布，并成功返回视图，但随后什么也不做。如果要显示返回的视图，则必须以某种方式将其附加到 dom。下面是一个常用的方法：

<div id="successDiv"></div>
<script type="text/javascript" language="javascript">
 $(document).ready(function () {
    $("#HotelDDL").change(function () {

        var text = $("#HotelDDL option:selected").text();
        var value = $("#HotelDDL option:selected").val();
        alert("Selected text=" + text + " Selected value= " + value);

        $.post("/Home/SearchForRooms",
         {
            HotelDDL: $("#HotelDDL option:selected").val() 
         }, function(result){//add callback for success - result is the returned view
            $("#successDiv").html(result);//place the view inside of the div
        });
    });
 });
</script>

评论回复

@TunAntun - 如果您希望视图拥有自己的页面，您应该使用经典帖子。没有办法从 ajax 实现这一点。你可以用javascript做到这一点

 $.post("/Home/SearchForRooms",
         {
            HotelDDL: $("#HotelDDL option:selected").val() 
         }, function(result){//add callback for success - result is the returned view
            $("#successDiv").html(result);//place the view inside of the div
        });

会成为

        var postForm = document.createElement("form");
        postForm.setAttribute("method","post");
        postForm.setAttribute("action","/Home/SearchForRooms");
        var postVal = document.createElement("input");
        postVal.setAttribute("type","hidden");
        postVal.setAttribute("name","HotelDDL");
        postVal.setAttribute("value",$("#HotelDDL option:selected").val() );
        postForm.appendChild(postVal);
        document.body.appendChild(postForm);
        $(postForm).submit();

这将动态发布您想要的帖子。然后在您的控制器中，它将正确重定向或返回视图。强烈建议从[HttpPost]您使用RedirectToAction的视图返回视图，然后从[HttpGet]方法返回视图，以防止刷新重新发布旧数据。

于 2012-10-30T22:47:21.543 回答