Kendo UI Grid Editors на основе значений столбца сетки - PullRequest
1 голос
/ 20 июня 2019

Я нашел эту статью в документации по пользовательскому интерфейсу Kendo , и она почти идентична моей проблеме, с которой я застрял.Открыв в Dojo, я редактирую несколько строк кода, особенно я переключаюсь в режим editable:"inline" и создаю выпадающий список для столбца type.Но кажется, что код работает не так, как я ожидал.

Любая идея, почему столбец Editor не реагирует после того, как я изменил значение type из выпадающего списка.Это сработало, если я сначала обновлюсь, а затем отредактирую обратно сетку.

Здесь я приведу демонстрацию из-за связанной ситуации

Благодарим вас за помощь.Спасибо

1 Ответ

1 голос
/ 20 июня 2019

Работает так, как задумано, как у вас это закодировано.Редактор для столбца вызывается только тогда, когда срабатывает событие edit .Если вы хотите, чтобы поле редактора изменялось динамически в зависимости от выбранного вами типа , когда он уже находится в режиме редактирования , вам придется обновить kendoDropDownList в вашем редакторе типов, чтобы использовать изменение событие , чтобы затем изменить другой редактор.

function typeEditor(container, options) {
        $('<input id="' + options.field + '" name="type" required dataTextField="type" dataValueField="type" data-bind="value:' + options.field + '"/>')
          .appendTo(container)
          .kendoDropDownList({
            optionLabel: "- Select Type -",
            dataTextField: "settingTypeName", 
            dataValueField:  "settingTypeName", 
            dataSource: settingTypeData,
            change: function(e){
              console.log(this.value());
              //UPDATE EDITOR HERE BASED ON VALUE
              //From your example, value is going to be dropdown, date, string, etc.
            }
        }).data('kendoDropDownList');
}

Редактировать в ответ на комментарий: Я не уверен, что вы подразумеваете под вами, вы не можете получить значениеиз выпадающего списка.Код выше буквально записывает значение в консоль.Следующим шагом будет выбор элемента, который вы хотите изменить, очистка его и добавление нового редактора на его место.

...
change: function(e){
    switch(this.value()) {
        ...
        case "string":
            $("[data-container-for=editor]").empty()
            $("<input id='editor' name='editor' type='text' class='k-textbox'>")
              .appendTo($("[data-container-for=editor]"));
            break;
        ...
    }
}
...