2

У меня есть страница, которая выглядит примерно так:Kendo UI - Как связать проверяется свойство (атрибут) и ручка нажмите событие для флажка на ViewModel с помощью кендо MVVM

<div data-role="view" id="side-root" data-title="Check-Boxes" data-model="myViewModel"> 
    <ul data-title="People" data-role="listview" data-bind="source: dsPeople" data-template="person_list_item" data-style="inset"></ul> 
</div> 
<script id="person_list_item" type="text/x-kendo-template"> 
    <label> 
    <span data-bind="text: firstName"></span> <span data-bind="text: lastName"></span> 
<input type="checkbox" data-bind="checked: isChecked, click: clickHandler"/> 
    </label> 
</script> 

Теперь MVVM связывание с поля isChecked работают правильно, но clickHandler никогда не вызывается. Если я удалю привязку «checked: isChecked» из значения привязки данных, тогда вызывается clickHandler.

Я также попытался настройками данных привязки к флажку, как:

data-bind="checked: isChecked, events: { click: clickHandler }" 

с таким же поведением.

Это по дизайну, или я что-то неправильно сконфигурировал?

Thanks

ответ

6

Попробуйте вместо этого использовать событие изменения. Я ударил по этой же проблеме и решил ее решить. Я думаю, вы не можете привязать данные к проверке, а также привязать событие click.

данных привязывать = "проверено: Checked, события: {изменение: clickHandler}"

+0

Если вы сделаете это, вы получите сообщение об ошибке: 0x800a01b6 - JavaScript runtime error: Object не поддерживает свойство или метод apply. Вы не можете использовать MVVM для привязки обработчиков событий к объектам HTML. Вы можете включить HTML onclick = обработчик событий или привязать к событию изменения Observable (ViewModel) (и затем проверить, в каком поле его запускается). – Will

1

Вот DEMO обрабатывать событие Флажок нажмите/изменить

HTML:

<input type="checkbox" data-bind="checked: checkboxChecked, events: { change: clickHandler}"> 
     Click the checkbox to view change event, also keep your console open 

JS:

var viewModel = kendo.observable({ 
    checkboxChecked: true, 
    clickHandler: function(e) { 
    console.log('clicked ', e); 
    alert("Checkbox checked = "+e.data.checkboxChecked); 
    } 
}); 
kendo.bind($("#example"), viewModel); 

 Смежные вопросы

  • Нет связанных вопросов^_^