使用局部视图填充 Kendo 对话框

Question

我有一个 kendo dialog，我想用 partial view 填充它，但它有点不起作用。我想通过单击按钮来填充对话框，所以这是我目前的代码

<div id="dialog"></div>

function showDetails(e) {
        e.preventDefault();
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

        var dialog = $("#dialog");

        console.log("objId", dataItem.OBJECTID1)
        $.ajax({
            url: '@Url.Action("SavePartial", "SettlementContract")',
            data: {
                id: dataItem.OBJECTID1
            },
            success: function (result) {
                if (result != null) {
                    dialog.html(result);
                    dialog.data("kendoDialog").open();
                }
            }
        });
    }

我尝试删除 success 中的 if 条件以防万一，但它也不起作用。它 returns 部分视图，但不在 kendo dialog 内部，甚至不会打开对话框。我做错了什么？

Answer 1

我们在我们的应用程序中这样做，这就是我们设置它的方式（我更新它以使用您的 controller/actions/ids）- 这是使用 ASP.NET 核心 MVC 包装器：


    @(Html.Kendo().Window()
        .Name("dialog")
        .Content("loading...")
        .Draggable()
        .Actions(actions => actions.Maximize().Close())
        .Resizable()
        .Modal(true)
        .Visible(false)
        .Events(e => e.Refresh("onDialogWindowRefresh"))
    )


<script>
  function showDetails(e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

    let win = $("#dialog").data("kendoWindow");

    win.refresh({
        url: "/SettlementContract/SavePartial/",
        data: {
            id: dataItem.OBJECTID1
        }
    });
  }

  function onDialogWindowRefresh(e) {
    e.sender.center().open();
  }
</script>

使用局部视图填充 Kendo 对话框

Populate a Kendo dialog with partial view

kendo-ui

dialog

partial-views