无法更新 MVC 5 局部视图

Question

在 MVC 5 页面中，我在表单中嵌入了部分视图。在页面中，局部视图的 HTML 定义如下所示：

<div id="partialview" class="col-md-4">
    @Html.Partial("_Sightings", @Model.FieldTripSightingList)
</div>

我的表单上有一个按钮，单击该按钮时，将通过 AJAX 调用加载此部分视图的数据，如下所示：

$('#retrieveSightingsButton').click(function () {
      var url = "/FieldTrip/GetSightings";
      tripName = $("#FieldTripName").val();
      userRowId = $("#UserList").val();

      $.get(url, { tripName: tripName, userRowId: userRowId }, function (data) {
                    $("#partialView").html(data);
                });
            });

C# 控制器方法如下所示：

[Authorize]
public ActionResult GetSightings(string tripName, int userRowId)
{
    var sightingList = this.FieldTripData.GetList(userRowId, tripName).ToList();

    return PartialView("_Sightings", sightingList);
}

最后，我的局部视图是这样的：

@model IEnumerable<WebBirder.Entities.FieldTripSighting>

    <table id="listingTable" class="table table-bordered table-responsive table-hover table-condensed sortable">
        <thead>
            <tr>
                <th data-defaultsort="asc">Common Name</th>
                <th>Sighting Time</th>
            </tr>
        </thead>

        <tbody class="searchable">
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.CommonName)
                    </td>
                    <td>
                        @item.SightingDate.ToShortDateString()
                    </td>
                </tr>
            }
        </tbody>
    </table>

所有这些都如我所料。问题是局部视图中的表格永远不会在页面上更新。当我单步调试调试器中的所有内容时，我可以看到执行部分视图的 Razor 代码以及放置在表中的所有值，但表数据从未在页面上刷新。我不确定是什么问题。

Answer 1

你的问题其实很简单。您的 HTML：

<div id="partialview" class="col-md-4">

你的 JavaScript：

$("#partialView").html(data);

ID 区分大小写；如果你确保它们匹配，你就会得到你想要的结果。

Answer 2

尝试将 partialView 容器移到 PartialView 本身之外：

<div id="partialview" class=" col-md-4">
    @Html.Partial("_Sightings", @Model.FieldTripSightingList)
</div>

部分视图：

@model IEnumerable<WebBirder.Entities.FieldTripSighting>
<table id="listingTable" class="table table-bordered table-responsive table-hover table-condensed sortable">
    ...
</table>

编辑：

尝试在浏览器开发工具中检查任何错误和服务器的响应，无论您是否将实际的 html 内容返回给客户端。

IE 也默认缓存 ajax get 请求，所以你也可以检查一下。