以ajax化方式加载局部视图

Question

我正在尝试使用 ajax 方法加载局部视图。因为我以前试过，但我不知道为什么这次它没有加载内容和数据。我想知道我哪里错了。我该如何纠正？

这是我的视图，其中一个 div 名为 "Add_Group"。

@(Html.Kendo().Window()
    .Name("AddEditGroupWindow")
    .Title("Edit Group")
    .Content(@<text><div id="Add_Group" style="display:none; width:100%;">
            @Html.Partial("~/Areas/Admin/Views/UserGroups/_AddGroupPartial.cshtml");
        </div> </text>)
                .Visible(false).Width(1000).Height(300))

在我使用 post 获取数据后，我正在尝试使用以下方法加载该局部视图 以下：

$.post("/UserGroups/getGroupDetail", { "groupId": id }, function (response) {
            $("#Add_Group").html(response.Data);
            $("#AddEditGroupWindow").data("kendoWindow").open();
            $("#Add_Group").show();
        });

在控制器中如下所示：

 public ActionResult GetGroupDetail(string groupId)
        {
            var data = string.Empty;
            UserGroupRoleModel objmodel = new UserGroupRoleModel();
            var groupEntity = this._userGroupServices.GetGroupDetail(Convert.ToInt32(groupId));
            return this.Json(new { Data = groupEntity });
        }

Answer 1

您正在 return 通过 post 方法创建 json 对象，而不是 html，因此当您调用

$("#Add_Group").html(response.Data);

它什么都不显示，因为 Data 是 json 而不是 html

您的 GetGroupDetail 需要 return html 才能显示。

根据您的代码，我假设您从 GetGroupDetail 中 return 是局部视图的模型（~/Areas/Admin/Views/UserGroups/_AddGroupPartial.cshtml），更改您的 GetGroupDetail 到 return 部分视图

public ActionResult GetGroupDetail(string groupId)
        {
            var data = string.Empty;
            UserGroupRoleModel objmodel = new UserGroupRoleModel();
            var groupEntity = this._userGroupServices.GetGroupDetail(Convert.ToInt32(groupId));
            return PartialView("~/Areas/Admin/Views/UserGroups/_AddGroupPartial.cshtml", roupEntity);
        }