Как предотвратить потерю значений Kendo MultiSelect после редактирования в шаблоне сетки?
У меня есть сетка, которая отображает разделенный запятыми список значений, и у него есть массив, который используется в редакторе шаблонов для сетки. (На сервере я преобразую разделенный запятыми список в массив для директивы Kendo multiselect AngularJS). У меня почти все работает: отображать, редактировать и добавлять значения в мультиселекте.
Происходит только одна странная вещь: после того, как я добавляю значение в мультиселект, нажимаю "Сохранить" в редакторе и снова открываю редактор, мультиэлемент отображает только одно из последних введенных значений. Я знаю, что значения там и проходят через конвейер, потому что значения попадают в базу данных. Я могу обновить страницу, открыть редактор, и все значения правильно отображаются в мультиселекте, включая то, которое я только что добавил.
Как будто кендо "забывает" большинство значений при повторном открытии редактора. Как это можно предотвратить? Нужно ли восстанавливать MultiSelect до значений? Если так, то как?
Я попытался добавить это событие onChange, но это не имело никакого эффекта. Я добавил valuePrimitive без эффекта. Я попытался указать k-rebind, но это вызвало ошибку.
Вот директива, используемая в text/x-kendo-template
:
<select kendo-multi-select
id="zipCode"
k-placeholder="'Enter zip codes...'"
style="width: 225px"
k-on-change="dataItem.dirty=true"
k-auto-bind="false"
k-min-length="3"
k-enforce-min-length="true"
k-data-source="options.zipCodeDataSource"
k-data-text-field="'text'"
k-filter="'startsWith'"
k-filtering="options.zipCodeFiltering"
k-no-data-template="'...'"
k-ng-model="dataItem.zipArray"
k-highlight-first="true" />
И это источник данных:
options.zipCodeDataSource = new kendo.data.DataSource({
severFiltering: true,
transport: {
read: {
url: serviceUrl + "ZipCode/Get",
type: "GET",
dataType: "json",
contentType: jsonType,
data: function (e) {
// get your widget.
let widget = $('#zipCode').data('kendoMultiSelect');
// get the text input
let filter = widget.input.val();
// what you return here will be in the query string
return {
filter: filter
};
}
},
},
schema: {
data: "data",
total: "Count",
model:
{
id: "text",
fields: {
text: { editable: false, defaultValue: 0 },
}
},
parse: function (response) {
return response;
}
},
error: function (e) {
}
});
Если я покажу {{dataItem.zipArray}}
в <pre>
все ожидаемые значения есть.
Интересно, нужно ли что-то добавлять в обработчик событий редактирования в определении сетки кендо, но я не уверен, что это будет. Мне пришлось сделать такое связывание для директивы dropdownlist.
edit: function (e) {
if (e.model.marketId === 0) {
e.container.kendoWindow("title", "Add");
} else {
e.container.kendoWindow("title", "Edit");
}
// re-bind multi-select here??
// These two lines actually cause the multiselect to lose pre-existing items in dataItem.zipArray
// var multiselect = kendo.widgetInstance(angular.element('#zipCode'));
// multiselect.trigger('change');
}
...
Обновить:
Это додзё демонстрирует проблему.
- Запустить додзё
- Изменить первую запись в сетке контрактов
- Добавьте почтовый индекс, такой как 22250
- Нажмите Сохранить
- Затем снова нажмите "Изменить" в первом ряду.
- Только почтовый индекс 22250 отображается в редакторе
Кроме того, я заметил, что если я изменю k-min-length="3"
в k-min-length="1"
, то проблема уходит. Но в сценарии, над которым я работаю, это должно быть 3
,
1 ответ
Кажется, это проблема самой кендо. Тогда об этой проблеме сообщили here.
Хорошо, на основании ответа от telerik, эта проблема была исправлена в выпуске 2017 R3 SP1 (2017.3.1018). Вы можете проверить это, используя этот обновленный пример dojo: