customize edit popup of command в сетке

Question

имеют простую сетку кендо с командой редактирования и уничтожения.

команда редактирования показывает всплывающее окно, где я могу изменять свои данные. Мне нужно настроить заголовок и текст кнопок (кнопка «Обновить и отменить») окна редактирования. это мой код:

var ds = createJSONDataSource(); 

function createJSONDataSource() { 

var dataSource = new kendo.data.DataSource({ 

    transport: { 
     autoSync: true, 
     read: { 
      type: "POST", 
      url: "WebServices/GetDataTest.asmx/getCustList", 
      dataType: "json", 
      contentType: mime_charset 
     } 
    }, 
    pageSize: 5, 
    schema: { 
     data: function (data) { 
      if (data) { 
       if (serverSelectReturnsJSONString) 
        return $.parseJSON(data.d); 

       else 
        return data.d; 
      } 
     }, 
     model:{ 
       id: "customer_id", 
       fields: { 
       customer_id: { type: "string", editable: false }, 
       name_customer: { type: "string" }, 
       address_customer: { type: "string" } 
       } 
     } 
    }); 

    var grid = $("#grid").kendoGrid({ 
    selectable: true, 
    theme: "metro", 
    dataSource: ds, 
    scrollable: { 
     virtual: true 
    }, 
    reorderable: true, 
    resizable: true, 
    pageable: true, 
    height: 300, 
    toolbar: ["save", "cancel"], 
    columns: [ 
     { field: "customer_id", title: "ID" }, 
     { field: "name_customer", title: "Cliente" }, 
     { field: "address_customer", title: "Indirizzo" }, 
     { field: "PI_customer", title: "Partita IVA", hidden: true }, 
     { field: "cap_customer", title: "CAP", hidden: true }, 
     { field: "city_customer", title: "Città" }, 
     { field: "state_customer", title: "Nazione", selected: false }, 
     { command: ["edit", "destroy"], title: " " } 
    ], 
    filterable: true, 
    editable: "popup", 
    sortable: true, 
    columnMenu: { 
     messages: { 
      columns: "Scegli colonne", 
      filter: "Applica filtro", 
      sortAscending: "Ordina (ASC)", 
      sortDescending: "Ordina (DESC)" 
     } 

    }, 
    groupable: { 
     messages: { 
      empty: "Trascina la colonna qui..." 
     } 
    } 

}); 

Надежда кто-то помогает мне!

благодарит заранее.

Answer 1

Для настройки кнопок вы должны определить команду, как:

{ 
    name: "edit", 
    text: { update: "Actualizar", cancel: "Cancelar"} 
}, 

Где я заменил Update на Actualizar и Cancel по Cancelar.

Так ваше определение столбцов будет:

columns: [ 
    { field: "customer_id", title: "ID" }, 
    { field: "name_customer", title: "Cliente" }, 
    { field: "address_customer", title: "Indirizzo" }, 
    { field: "PI_customer", title: "Partita IVA", hidden: true }, 
    { field: "cap_customer", title: "CAP", hidden: true }, 
    { field: "city_customer", title: "Città" }, 
    { field: "state_customer", title: "Nazione", selected: false }, 
    { 
     command: [ 
      { 
       name: "edit", 
       text: { update: "Actualizar", cancel: "Cancelar"} 
      }, 
      "destroy" 
     ], 
     title: " " 
    } 
], 

Для изменения заголовка окна, вы должны изменить editable: "popup", по:

editable : { 
    mode : "popup", 
    window : { 
     title: "Edición", 
    } 
}, 

Где определить название как Edición.

Answer 2

Кредит для этого на самом деле принадлежит Adarsh ​​K ответил 10 июн '14 в 15:00 Но я считаю, что я читал, что вы не должны размещать ссылки на другие ответы, поэтому, пожалуйста, если Mr OnaBai прекратит отвечать на эти сообщения и проигнорировать Дело в том, что каждый делает POPUP НЕ кнопки команд на сетке, мы все могли бы быть гораздо счастливее ... и теперь элегантный ответ г Адарш K в & мой дополнение ..

function OnEdit(e){ 
if (e.model.isNew()) 
{ 
    var update = $(e.container).parent().find(".k-grid-update"); 
    $(update).html('<span class="k-icon k-update"></span>Insert'); 
    } 
} 

Это «раздел» в .kendoGrid umm 'structure', эта встроенная функция дополнительно позволяет вам изменить заголовок POPUP диалогового окна условно ... вот мой Добавить раздел (новый) изменяет текст кнопки для сохранения и название для моего редактирования POPUP в тексте заголовок Добавить вместо текста заголовка Edit ...

 edit: function (e) 
     { 
      if (e.model.isNew()) 
      { 
       $('.k-window-title').text("Add New xxxxxxxxxx"); 
       var update = $(e.container).parent().find(".k-grid-update"); 
       $(update).html('<span class="k-icon k-update"></span>Save'); 
      }       
      else 
      { $('.k-window-title').text("Edit Existing xxxxxxxxxxx"); } 
     }, 

     columns: [ 
         { field:......... 

Answer 3

Другой способ настройки заключается в следующем:

columns: [ 
{ command: 
    [{ name: 'edit', 
    click: editButtonClick, 
    template: editButtonTemplate }], title: 'Edit', width: '40px'}..] 


var editButtonTemplate = '<a class="btn btn-link btn-xs k-grid-edit" href="\\#"><span class="glyphicon glyphicon-pencil"></span></a>'; 

editButtonClick = function (e) { 
/* Changes default rendering of 'update' & 'cancel' buttons 
* but keeps default behaviour 
*/ 
var btnCancel = $('.k-grid-cancel'); 
btnCancel.removeClass('k-button k-button-icontext').addClass('btn btn-link btn-xs'); 
btnCancel.text(''); 
btnCancel.append('<span class="glyphicon glyphicon-ban-circle"></span>'); 

var btnOk = $('.k-grid-update'); 
btnOk.removeClass('k-button k-button-icontext k-primary').addClass('btn btn-link btn-xs'); 
btnOk.text(''); 
btnOk.append('<span class="glyphicon glyphicon-ok-circle k-update"></span>'); 

}

Этот подход обрабатывает click событие стандартного edit командует и изменяет отображаемый html, но сохраняет стандартную функциональность.

Важной деталь - функциональность обновления является управляющей сеткой в ​​радиолампе соединена с элементом с k-update атрибутом, в то время как отменить функциональность поездку на k-grid-cancel.