Kendo UI - Kendo Grid Редактировать всплывающее окно для добавления и вставки для редактирования

Question

У меня есть сетка кендо, и событие «Редактировать» открывает всплывающее окно, используя приведенный ниже код.

  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». Таким образом, мой вопрос здесь ...

Я хочу, чтобы редактирование подредакции делало внутреннее редактирование. Но я хочу добавить «Добавить новую» (панель инструментов: [{name: «create», текст: «Добавить нового сотрудника»}]) для всплывания шаблона. Это возможно?

Answer 1

У меня также была такая же проблема, но после того, как RnD в течение 2-3 дней, пришли к решению, которое я реализовал с помощью API DataSource и пользовательской панели инструментов.

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

Надеюсь, это вам поможет.

Ref: Telerik forums

счастливым кодирования !!