如何在kendo.ui.grid中创建用于编辑的自定义kendo.ui.Window

我是kendo.Ui的创始人,我编写了创建网格的代码

@(Html.Kendo().Grid<BrandViewModel>(Model)
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.BrandName);
        columns.Bound(p => p.BrandAbbr);
        columns.Bound(p => p.SrcImage);

        columns.Command(command => command.Custom("Edit").Click("editItem"));

    })

    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("CustomCommand_Read", "Brand"))
         .Model(model => model.Id(p => p.Id))

               )
)

我想当用户点击Edit按钮打开Edit view在剑道窗口我写这个代码

@(Html.Kendo().Window().Name("Details")
    .Title("Customer Details")
    .Visible(false)
    .Modal(true)
    .Draggable(true)

    .Width(300)
)



<script type="text/x-kendo-template" id="template">
    <div id="details-container"> <!-- this will be the content of the popup -->
        BrandName: <input type='text' value='#= BrandName #' />

    </div>
</script>

和java脚本代码:

<script type="text/javascript">
    var detailsTemplate = kendo.template($("#template").html());

    function editItem(e) {
        e.preventDefault();

        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

        $("#Details").data("kendoWindow").refresh({
            url: "/Brand/Edit/" + dataItem.Id
        });
        $("#Details").data("kendoWindow").open();



    }
</script>

此代码工作正常第一次点击一个按钮,但是当我第二次点击。我遇到了以下错误

0x800a138f - JavaScript runtime error: Unable to get property 'refresh' of undefined or null reference

请帮助我,谢谢大家


我记得我对这个控制有类似的问题。 现在它适用于我以下的Javascript代码:

<script type="text/javascript">
    var detailsTemplate = kendo.template($("#template").html());
    var windowObject;

    $(document).ready(function () {
        windowObject = $("#Details").data("kendoWindow");
    });

    function editItem(e) {
        e.preventDefault();

        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

        windowObject.refresh({
            url: "/Brand/Edit/" + dataItem.Id
        });
        windowObject.open();
    }
</script>

希望能帮助到你 !


问题是,默认情况下,窗口在关闭时将被销毁(从DOM中移除)。 我建议删除下面例子中添加的“未定义”条件,而不要在第一个地方创建“Details”div。

<script type="text/javascript">
    var detailsTemplate = kendo.template($("#template").html());

    function editItem(e) {
        e.preventDefault();

        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

        if($("#Details") == undefined)
            $("body").append("<div id="Details"></div>

        $("#Details").data("kendoWindow").refresh({
            url: "/Brand/Edit/" + dataItem.Id
        });
        $("#Details").data("kendoWindow").open();



    }
</script>
链接地址: http://www.djcxy.com/p/73535.html

上一篇: how to create custom kendo.ui.Window for edit in kendo.ui.grid

下一篇: How to create folders in google drive without duplicate?