私のhtmlには、このデータバインディングがあります
<select data-bind="options: graders,
optionsText: 'LastName',
optionsValue: 'Id',
selectmenuValue: selectedGroup().GraderId,
optionsCaption: 'Choose a grader'">
</select>
私の JavaScript では、UI をリアルタイムで更新するために次の手順を実行しています。
ko.bindingHandlers.selectmenuValue = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
if (typeof ko.bindingHandlers.value.init !== 'undefined') {
ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, viewModel);
}
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
if (typeof ko.bindingHandlers.value.update !== 'undefined') {
ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor, viewModel);
}
$(element).selectmenu();
}
};
Firefox ではすべて正常に動作していますが、IE と Chrome では、コンボボックスにマウスを合わせると、ポップアップがすぐに閉じます。ポップアップは、Firefox のように開いたままにする必要があります。何度も試してみたところ、ボタンを押しながらマウスを最初のアイテムから他のアイテムの1つに移動し、そのポイントで上に押すと、開いたままになることがわかりました。
誰でもこの問題を解決する方法を知っていますか?
更新: ポップアップの場所が IE と Chrome で少しずれていることに気付きました。それが上記の動作の理由だと思います。まだ修正を探しています。