标签:sel 数据 数据绑定 ken tutorial pre data-bind 适用于 school
Checked 绑定用在 checkbox ()或 radio button ()上。注意: checked 绑定只适用于支持 checked 的 DOM 元素,其它 DOM 元素的值可以使用 value 绑定。
多选钮(Checkedbox) checked 绑定使用 Kendo checked 绑定到 checkbox 时,当 ViewModel 对应的值为 true, Checkbox 显示选中状态,而当用户点击 checkbox 选择状态时,对应的 ViewModel 的值也随之变化。
例如:
<input type="checkbox" data-bind="checked: isChecked" /> <script> var viewModel = kendo.observable({ isChecked: false }); kendo.bind($("input"), viewModel); </script>
本例,因为 viewModel 的 isChecked 初始值为 false,因此 Checkbox 显示未选状态,如果此时用户点击选择该选项,那么 viewModel 的 isChecked 的值为 true .
checked 绑定支持把 ViewModel 对象的一个数组属性绑定到一组多选框, 选择一组多选框的某个 Checkbox,它的值被添加到 ViewModel 的数组中,反之,该值从数组中移除。
<input type="checkbox" value="Red" data-bind="checked: colors" />Red <input type="checkbox" value="Green" data-bind="checked: colors" />Green <input type="checkbox" value="Blue" data-bind="checked: colors" />Blue <script> var viewModel = kendo.observable({ colors: ["Red"] }); kendo.bind($("input"), viewModel); </script>
在这个例子中,第一个 checkbox 显示选择状态,是因为它的 value 值 ”Red” 包含在 ViewModel 数组 colors 中, 如果此时选择 Green ,那么 colors 数组变为 Red 和 Green . 如果去除选择 Red ,则 Colors 数组只包含 Green .
单选钮(Radio Button) checked 绑定Kendo MVVM 只有在 ViewModel 的属性和对应的 radio button 的 value 值一致时才会显示该 Radio Button 为选中状态。
<input type="radio" value="Red" name="color" data-bind="checked: selectedColor" />Red <input type="radio" value="Green" name="color" data-bind="checked: selectedColor" />Green <input type="radio" value="Blue" name="color" data-bind="checked: selectedColor" />Blue <script> var viewModel = kendo.observable({ selectedColor: "Green" }); kendo.bind($("input"), viewModel); </script>
标签:sel 数据 数据绑定 ken tutorial pre data-bind 适用于 school
原文地址:https://www.cnblogs.com/miaosj/p/10362199.html