Hello,
The objective is to make a CSS style editor. Code is available at https://jsfiddle.net/9b1umpmj/2/.
The issue I am facing is focused on the cssDropDownEditor function on line 190. The version of the code without validation works as desired (simply remove the name attribute when creating the combobox line 191):
// This function is taken from http://demos.kendoui.com/web/grid/editing-custom.html
function
cssDropDownEditor(container, options) {
$(
'<input data-bind="value: '
+ options.field +
'" required data-required-msg="'
+ that.options.messages.validation.name +
'">'
)
.appendTo(container)
.kendoComboBox({
autoBind:
false
,
change:
function
(e) {
// The change event handler assigns a default value depending on the style name
if
(e
/*instanceof $.Event*/
&& e.sender
instanceof
kendo.ui.ComboBox) {
var
dataItem = e.sender.dataItem(),
// grid = container.closest('.k-grid').data('kendoGrid'),
grid = that.element.data(
'kendoGrid'
),
uid = container.parent().attr(kendo.attr(
'uid'
));
if
(grid
instanceof
kendo.ui.Grid && $.type(uid) ===
'string'
&& $.type(dataItem) !==
'undefined'
) {
var
style = grid.dataSource.getByUid(uid);
style.set(
'value'
, dataItem.get(
'value'
));
}
}
},
//dataSource: viewModel.css,
dataTextField:
'name'
,
dataValueField:
'name'
})
.data(
'kendoComboBox'
);
$(
'<span class="k-invalid-msg" data-for="style_name"></span>'
).appendTo(container);
}
The version with validation does not work as desired. Actually the viewModel is not updated. To test it modify line 191 to add a name attribute as follows:
$(
'<input name="style_name" data-bind="value: '
+ options.field +
'" required data-required-msg="'
+ that.options.messages.validation.name +
'">'
)
The reason is the following:
- The combobox creates an input named style_name_input;
- The grid uses this name to bind this input as follows data-bind="value: style_name_input", which obviously does not exist in the viewModel,
- therefore data-binding with the viewModel does not work when specifying a name as required for validation.
Any workwaround/fix?