Kendo Treeview-Knoten Bearbeiten/Aktualisieren

Question

Ich habe eine Kendo Treeview, die Daten anzeigt. Aber jetzt möchte ich die Treeview Labels bearbeiten. Versucht mehrere Wege und googelte es, aber fand nicht die richtige Lösung. Unten ist mein Code kann jemand eine Lösung vorschlagen.Meine aktuelle Situation ist das Textfeld öffnet, wenn ich auf Bearbeiten Symbol klicken und den Text ändern und klicken Sie auf Speichern, aber nichts passiert.

Vorlage bearbeiten

<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; 
      } 
     } 
    }, 
    }); 

Funktion bearbeiten Knoten:

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

Das Ereignishandler zu externen windo applyed werden soll w, nicht zu 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(); 
})