これは、すべてのチェックボックスをチェックするためにこれまでに持っているものであり、これらのチェックボックスはドロップダウンリストにあります。
_popup: function () {
e.fn._popup.call(this), this.popup.one("open", function () {
this.wrapper = c.wrap(this.element).addClass("km-popup")
});
// Modify popup to include a "Select All" checkbox.
$(this.popup.element).children("ul:first-child").before("<ul class='k-list k-reset' unselectable='on' style='overflow: auto;'><li class='k-item' unselectable='on'><input id='selectall' type='checkbox' /><span>Selected</span></li></ul><hr/>");
// Attach event handler to "Select All checkbox.
$("#selectall").bind('change', function(){
if($(this).prop('checked')){
$(".checkbox").prop('checked', true);
}else{
$(".checkbox").prop('checked', false);
}
});
これにより、チェック ボックスが更新され、すべてが選択または選択解除されて画面に視覚的に表示されます。ビューモデルの状態、つまりチェックボックスが true か false かを示すボタンがあります。問題は、selectall が動作し、すべてをチェックすると、ビューモデルがそれらの変更で更新されないことです。つまり、すべて選択チェックボックスをクリックするたびに、チェックされているかどうかに関係なく、テスト ボタンをクリックするとすべてが false のままになります。すべて選択をクリックしたときにビューモデルを更新する方法が必要です。プログラム全体はかなり複雑ですが、私の問題を理解するためにさらに必要な場合はお知らせください。
ここに私のビューモデルが含まれています
var viewModel = kendo.observable({
options: [{ text: "test1", value: 1, selected: false },
{ text: "test2", value: 2, selected: false },
{ text: "test3", value: 3, selected: false },
{ text: "test4", value: 4, selected: false }
]
});