2015-09-23 121 views
0

我有一個劍道網格和編輯事件打開使用下面的一段代碼彈出。Kendo網格編輯彈出選項添加和內聯編輯

  editable: { mode: "popup", 
      template: kendo.template($("#popup_editor").html()), 
      update: true, 
      destroy: true, 
      confirmation: "Are you sure you want to remove this employee? Click OK to delete record." 
     } 

彈出窗口中還有(popup_editor模板)網格。子網格的編輯設置爲'inline'。所以我在這裏的問題是......

我想要subrid的編輯做inine編輯。但我想要「添加新的」(工具欄:[{name:「create」,text:「Add New Employee」}])功能來彈出一個模板。這可能嗎?

回答

-1

我也面臨同樣的問題,但在做了2-3天的RnD之後,來到解決方案,我通過dataSource API和自定義工具欄命令實現了它。

toolbar: [{ text:"Add new record", className: "grid-add-new-record" }], // specify a custom toolbar button 

$("#grid .grid-add-new-record").on("click", function(e) { 
    var dataSource = $("#grid").data("kendoGrid").dataSource; 

    var window = $("<div id='popupEditor'>") 
     .appendTo($("body")) 
     .kendoWindow({ 
      title: "Add new record", 
      modal: true, 
      content: { 
       //sets window template 
       template: kendo.template($("#createTemplate").html()) 
      } 
     }) 
     .data("kendoWindow") 
     .center(); 

    //determines at what position to insert the record (needed for pageable grids) 
    var index = dataSource.indexOf((dataSource.view() || [])[0]); 

    if (index < 0) { 
     index = 0; 
    } 
    //insets a new model in the dataSource 
    var model = dataSource.insert(index, {}); 
    //binds the editing window to the form 
    kendo.bind(window.element, model); 
    //initialize the validator 
    var validator = $(window.element).kendoValidator().data("kendoValidator") 

    $("#btnUpdate").on("click", function(e) { 
     if (validator.validate()) { 
      dataSource.sync(); //sync changes 
      window.close(); 
      window.element.remove(); 
     } 
    }); 

    $("#btnCancel").on("click", function(e) { 
     dataSource.cancelChanges(model); //cancel changes 
     window.close(); 
     window.element.remove(); 
    }); 
}); 

希望這會對你有所幫助。

編號:Telerik forums

編碼快樂!