1

我正在开发一个 MVC Kendo UI 项目，但遇到以下问题：

我有一个带有自定义编辑按钮的可编辑剑道网格，可以在剑道窗口上打开部分视图，就像“编辑器模板”一样。这似乎第一次工作正常，但如果我关闭窗口并尝试编辑另一个项目，甚至相同的项目都不起作用。我认为当我关闭窗口时，这会从 DOM 中删除元素，但无法弄清楚如何修复它。这是一些代码：

@(Html.Kendo().Grid(Model)
      .Name("gridUbicaciones")
      .Columns(col =>
          {
              col.Bound(x => x.UbicacionId);
              col.Bound(x => x.Nombre);
              col.Bound(x => x.Latitud);
              col.Bound(x => x.Longitud);
              col.Bound(x => x.Altitud);
              col.Bound(x => x.Comentario);
              col.Command(cmd =>
                  {
                      cmd.Custom("Editar").Click("editItem");                     
                      cmd.Destroy().Text("Borrar");
                  }).Width(210).HtmlAttributes(new {style = "text-align:center;"});
          })
      .ToolBar(toolbar => toolbar.Create().Text("Agregar") )
      .Pageable()
      .Sortable()
      .Filterable()
      .DataSource(dsource => dsource
                                 .Ajax()
                                 .PageSize(8)
                                 .ServerOperation(false)
                                 .Model(model => 
                                     {
                                         model.Id(x => x.UbicacionId);
                                         model.Field(x => x.UbicacionId).Editable(false);
                                     })
                                 .Read(read => read.Action("Ubicaciones_Read", "Home").Type(HttpVerbs.Post))
                                 .Destroy(destroy => destroy.Action("Ubicaciones_Destroy", "Home"))
                                 .Update(update => update.Action("Ubicaciones_Update", "Home"))
                                 .Create(create => create.Action("Ubicaciones_Create", "Home"))
      ))
<div id="kendoWindowPopUp"></div>

JAVASCRIPT：

function editItem(e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    if ($("#kendoWindowPopUp") == undefined)
        $("divUbicaciones").append("<div id=\"kendoWindowPopUp\"></div>");
    var windowObject = $("#kendoWindowPopUp").kendoWindow({
        resizable: false,
        modal: true,
        refresh: function () { this.center();},
        onClose: function () {

            windowObject.destroy();
            alert('hi close');// THIS CODE DOES NOT RUN
        }
       
    })
    .data("kendoWindow");
    
  

    windowObject.refresh({
        url: "/Home/EditorUbicacion?UbicacionId=" + dataItem.UbicacionId

    });
        windowObject.open();

}

我收到以下 js 错误：

未捕获的类型错误：对象 [object Object] 没有方法“kendoWindow”

4

2 回答 2

1

答案在评论中。在这里为像我这样通过谷歌点击它的人添加它:)。当通过 AJAX 加载的页面包含对 jQuery 的脚本引用时，通常会导致此问题。当 jQuery 重新初始化时，所有基于 jQuery 的数据属性都被清除，包括保存 Kendo UI 小部件对象的 data(kendoWidget) 属性。

  1. 请确保窗口不会在页面上加载重复的 jQuery 实例。

  2. 使用“iframe”

    $("#dialog").kendoWindow({
   // load complete page...
   content: "/foo",
   // ... and show it in an iframe
   iframe: true
});

    您可以在 Telerik 文档中找到更多信息

于 2017-08-21T06:43:38.350 回答
0

您的问题在于您的 editItem()，默认情况下 onClose 不会从 DOM 中删除元素，您是故意这样做的。要刷新窗口内容，请进行以下检查：

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

        // Window variable
        var wnd = $("#kendoWindowPopUp");
        if (!wnd.data("kendoWindow")) {
            // initialized on first call and successive calls will reuse this object
            wnd.kendoWindow({
                width: "600px",
                title: "title",
                actions: [
                    "refresh",
                    "Minimize",
                    "Maximize",
                    "Close"
                ],
                resizable: false,
                modal: true,
                visible: false
                // Leave all events with their default behavior                
            });
        }

        var windowObject = wnd.data("kendoWindow");
        windowObject.refresh({
            url: "/Home/EditorUbicacion?UbicacionId=" + dataItem.UbicacionId
        });
        windowObject.open().center();
    }
于 2013-11-07T14:41:56.323 回答