Недавно я начал изучать KendoUI и придумал эту проблему. Я пытаюсь включить dropdownlist в сетку кендо с использованием подхода MVVM. Сетка имеет 3 столбца - флажок, текст и выпадающий список. Я хочу вручную установить значение dropdownlist в зависимости от того, установлен флажок или нет. В качестве примера здесь я пытаюсь установить класс как «класс 3», если флажок не установлен. Несмотря на то, что индекс установлен на 2, он возвращается к классу из модели в конце события dataBound. Кто-нибудь может мне с этим помочь? Мне нужно принудительно установить раскрывающийся индекс. Спасибо.
<script type="text/x-kendo-template" id="checkboxGrid">
<input type="checkbox" data-bind="checked: IsChecked" />
</script>
<script type="text/x-kendo-template" id="ddlGrid">
<input data-role="dropdownlist"
data-auto-bind="true"
data-text-field="name"
data-value-field="id"
data-auto-bind="true"
data-bind="source: actionSource, value: class, events:{dataBound: dataBound }"/>
</script>
<div id="content" >
<div id="my-grid"
data-role="grid"
data-sortable="true"
data-selectable="true"
data-columns='[
{"field": "IsChecked", "title":" ", template: kendo.template($("#checkboxGrid").html())},
{"field": "Name", "title":"Name" },
{"field": "class", "title":"Class", template: kendo.template($("#ddlGrid").html())}
]'
data-bind="source: dataSource">
</div>
</div>
<script>
$(document).ready(function() {
var viewModel = new kendo.data.ObservableObject({
dataSource: [
{ IsChecked: true, Name: "Student 1", class: { name: "Class 1", id:"1" }},
{ IsChecked: false, Name: "Student 2", class: { name: "-Please Select-", id:"999" } },
{ IsChecked: false, Name: "Student 3", class: { name: "-Please Select-", id:"999" }},
{ IsChecked: true, Name: "Student 4", class: { name: "Class 3", id:"3" } }
],
actionSource: [
{ name: "-Please Select-", id:"999"},
{ name: "Class 1", id:"1" },
{ name: "Class 2", id:"2" },
{ name: "Class 3", id:"3" }
],
dataBound: function(e) {
var ddl = e.sender;
var gridRow = $(ddl.element).closest( "tr" );
var checkbox = $(gridRow).find('input[type=checkbox]');
debugger;
if(checkbox.prop("checked") == false){
console.log("Checkbox checked : " + false);
//explicitly trying to set class to 'Class 3'
ddl.select(2);
debugger;
}
//Even though index is set to 2, it gets reverted back to the class from the model at the end of the event
}
});
kendo.bind($('#my-grid'), viewModel);
});
</script>
javascript,jquery,kendo-ui,kendo-grid,kendo-dropdown,
Недавно я начал изучать KendoUI и придумал эту проблему. Я пытаюсь включить dropdownlist в сетку кендо с использованием подхода MVVM. Сетка имеет 3 столбца - флажок, текст и выпадающий список. Я хочу вручную установить значение dropdownlist в зависимости от того, установлен флажок или нет. В качестве примера здесь я пытаюсь установить класс как «класс 3», если флажок не установлен. Несмотря на то, что индекс установлен на 2, он возвращается к классу из модели в конце события dataBound. Кто-нибудь может мне с этим помочь? Мне нужно принудительно установить раскрывающийся индекс. Спасибо.
<script type="text/x-kendo-template" id="checkboxGrid">
<input type="checkbox" data-bind="checked: IsChecked" />
</script>
<script type="text/x-kendo-template" id="ddlGrid">
<input data-role="dropdownlist"
data-auto-bind="true"
data-text-field="name"
data-value-field="id"
data-auto-bind="true"
data-bind="source: actionSource, value: class, events:{dataBound: dataBound }"/>
</script>
<div id="content" >
<div id="my-grid"
data-role="grid"
data-sortable="true"
data-selectable="true"
data-columns='[
{"field": "IsChecked", "title":" ", template: kendo.template($("#checkboxGrid").html())},
{"field": "Name", "title":"Name" },
{"field": "class", "title":"Class", template: kendo.template($("#ddlGrid").html())}
]'
data-bind="source: dataSource">
</div>
</div>
<script>
$(document).ready(function() {
var viewModel = new kendo.data.ObservableObject({
dataSource: [
{ IsChecked: true, Name: "Student 1", class: { name: "Class 1", id:"1" }},
{ IsChecked: false, Name: "Student 2", class: { name: "-Please Select-", id:"999" } },
{ IsChecked: false, Name: "Student 3", class: { name: "-Please Select-", id:"999" }},
{ IsChecked: true, Name: "Student 4", class: { name: "Class 3", id:"3" } }
],
actionSource: [
{ name: "-Please Select-", id:"999"},
{ name: "Class 1", id:"1" },
{ name: "Class 2", id:"2" },
{ name: "Class 3", id:"3" }
],
dataBound: function(e) {
var ddl = e.sender;
var gridRow = $(ddl.element).closest( "tr" );
var checkbox = $(gridRow).find('input[type=checkbox]');
debugger;
if(checkbox.prop("checked") == false){
console.log("Checkbox checked : " + false);
//explicitly trying to set class to 'Class 3'
ddl.select(2);
debugger;
}
//Even though index is set to 2, it gets reverted back to the class from the model at the end of the event
}
});
kendo.bind($('#my-grid'), viewModel);
});
</script>
01JavaScript, JQuery, кендо-щ, кендо-сетка, кендо-выпадающий,