Kendo UI ComboBox - Background Color Binding Error
Demonstrated how setting the background color of a Kendo combobox removes its bindings.
HTML
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<div id="example">
<input id="cb1" class="combobox" />
<input id="cb2" class="combobox" />
<input id="cb3" class="combobox" />
</div>
CSS
#example > * {
display: block;
margin: 10px;
}
JavaScript
var viewModel = kendo.observable({
allowCustomValues: false,
testData: new kendo.data.DataSource({
data: [{
id: 1,
name: 'BMW'
}, {
id: 2,
name: 'Audi'
}, {
id: 3,
name: 'Ferrari'
}]
})
});
$('.combobox').kendoComboBox({
dataSource: viewModel.testData,
autoBind: false,
dataTextField: 'name',
dataValueField: 'id',
suggest: true,
placeholder: 'Select a car'
});
kendo.bind('#example', viewModel);
// ******************************************
// SET BACKGROUND COLOR
// ******************************************
var cb = $("#cb2").data("kendoComboBox");
cb.wrapper.find(".k-input").css("background", "#FFFFE0");