Kendo UI MVVM中选择选项的Javascript设置

Question

我需要使用纯 JavaScript 从恰好绑定到 Kendo UI 可观察对象 (MVVM) 的选择元素中选择一个选项，并且我需要更新绑定的视图模型。

<select id="titleField" data-bind="value: Title" >
  <option value=""></option>
  <option value="Mr.">Mr.</option>
  <option value="Ms.">Ms.</option>
  <option value="Dr.">Dr.</option>
</select>

我试过了：

document.getElementById('titleField').value='Mr.';

还有：

var sel = document.getElementById('titleField');
var opts = sel.options;
for (var opt, j = 0; opt = opts[j]; j++) {
  if (opt.value == 'Mr.') {
    sel.selectedIndex = j;
    break;
  }
}

他们都设置了字段，但是 MVVM 绑定没有更新。

如果视图模型没有更新，那么当记录被保存时，选择的值不会被持久化。

通常我会直接操作视图模型并利用双向绑定，如下所示：

myViewModel.Set("Title", "Mr.");

但是我不能这样做，因为我是从 CefSharp 浏览器实现运行的，不一定知道或关心 Kendo UI 正在使用中。

编辑：在我看来，也许上面的方法应该可行，但还有其他一些奇怪的事情发生，比如时间问题，所以我在网站上测试了它（页面加载了 javascript），实际上它并没有更新视图模型使用上述技术。

Answer 1

答案，现在如此明显，必须在更新元素后触发 onChange 事件。

对于 Chrome（我唯一关心的）这有效：

var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", false, true);
sel.dispatchEvent(evt);

现在剑道视图模型已更新。