jquery - 无法更新 MVC 5 部分 View

Question

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

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

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

$('#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# Controller 方法如下所示:

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

    return PartialView("_Sightings", sightingList);
}

最后，我的部分 View 如下所示:

@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>

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

Answer 1

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

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

您的 JavaScript:

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

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