Kendo Treeview節點編輯/更新

Question

我有一個顯示數據的kendo treeview。但是現在我想編輯Treeview標籤。嘗試了幾種方法並使用Google搜索，但coudnlt找到了正確的解決方案。下面是我的代碼任何人都可以提出一個解決方案。我目前的情況是文本框是開放的，如果我點擊編輯圖標並更改文本並單擊保存但沒有任何事情發生。

編輯模板

<script id="editTemplate" type="text/x-kendo-template"> 
    <label>Text: <input class="k-textbox" value="#=node.LINK#" /></label> 
    <button class="k-button k-primary">Save</button> 
</script> 

的TreeView：

function treeView() { 
treeMenu = new kendo.data.HierarchicalDataSource({ 
    template: kendo.template($("#treeview-template").html()), 
    schema: { 
     data: function (response) { 
      var rdata = {}; 
      if (response.d) { 
       rdata = JSON.parse(response.d); 
      } 
      else { 
       rdata = response; 
      } 
      return rdata; // ASMX services return JSON in the following format { "d": <result> }. 
     }, 
     schema: { 
      model: { 
       hasChildren: true, 
       id: "id", 
       children: "HasChildren", 
       hasChildren: "HasChildren", 
       fields: { 
        ID: { editable: false, nullable: false, type: "string" }, 
        LABEL: { editable: true, nullable: true, type: "string" }, 
        LINK: { editable: true, nullable: true, type: "string" }, 

       }, 
      } 
     } 
    }, 
    transport: { 
     read: { 
      url: "/Services/TreeServices.asmx/getTree", 
      contentType: "application/json; charset=utf-8", 
      type: "POST", 
      datatype: "json" 

     }, 
      parameterMap: function (data, type) { 
      if ((type == "read") || (type == "update") || (type == "create") || (type == "destroy")) { 
       console.log('parameterMap: data => ' + JSON.stringify(data)); 
       return JSON.stringify(data); 
      } else { 
       return data; 
      } 
     } 
    }, 
    }); 

功能編輯節點：

function editNode() { 
var editTemplate = kendo.template($("#editTemplate").html()); 
var treeview = $("#treeview").data("kendoTreeView"); 
var selectedNode = treeview.select(); 
var node = treeview.dataItem(selectedNode); 
var data = { node: node }; //A value in JavaScript/JSON 
var result = template(data); 

$("<div />") 
    .html(editTemplate({ node: node})) 
    .appendTo("body") 
    .kendoWindow({ 
     modal: true, 
     //visible: true, 
     deactivate: function() { 
      this.destroy(); 
     } 
    }) 

$("#treeview").on("click", ".k-primary", function (e) { 
    var dialog = node.closest("[data-role=window]").getKendoWindow(); 
    var textbox = dialog.element.find(".k-textbox");   
    node.set("text", textbox.val());  
    dialog.close(); 
}) 

}

Answer 1

該事件處理程序應該applyed外部WINDO W，不treeView

$("<div />") 
    .html(editTemplate({ node: node})) 
    .appendTo("body") 
    .kendoWindow({ 
     modal: true, 
     //visible: true, 
     deactivate: function() { 
      this.destroy(); 
     } 
    }) 
.on("click", ".k-primary", function (e) { 
    //e.preventDefault();   
    var dialog = $(e.currentTarget).closest("[data-role=window]").getKendoWindow(); 
    var textbox = dialog.element.find(".k-textbox");  
    node.text = undefined; // force refresh of dataItem 
    node.set("text", name);  
    dialog.close(); 
})