的js

Question

我正在使用jQuery更新数据绑定选择下拉列表的选定值 $（项目）.VAL（的newval）但是，底层绑定的KO数据没有更新。有没有办法让绑定数据更新？

更新selectedIndex的javascript代码不了解数据模型

Answer 1

这里有一个小提示，以正确的方式展示如何做到这一点，你是如何做到的（破碎的方式）以及如何做到就像你问过（错误的方式:)），以及一种方式让它工作）

的js

function vm() {
    var items = ko.observableArray(
           ['initial', 'changedModel', 'changedBroken', 'changedHacked']);

    var selectedItem = ko.observable();

    function changeModel(){
        selectedItem("changedModel");
    }

    function changeDropdown(){
        $("#selectBox").prop('selectedIndex', 2);
    }

    function changeDropdownHack(){
        $("#selectBox").prop('selectedIndex', 3);
        $("#selectBox").change();
    }

    return {
        items: items,
        selectedItem: selectedItem,
        changeModel: changeModel,
        changeDropdown: changeDropdown,
        changeDropdownHack: changeDropdownHack
    }
};

ko.applyBindings(vm);

的HTML

<select id="selectBox" data-bind="options: items, value: selectedItem"></select>
<h2>Selected Value: </h2>
<div data-bind="text: selectedItem"></div>

<button data-bind="click: changeModel">change Model</button><br />
<button data-bind="click: changeDropdown">change Dropdown With Jquery (Broken)</button><br />
<button data-bind="click: changeDropdownHack">change Dropdown With Jquery + Hack</button><br />

Answer 2

您应该在viewModel中插入其他值检查下拉列表的值数组是否为.observableArray
如果是更新后调用.valueHasMutated（）你可以选择这样的淘汰赛环境

var knockoutContect = ko.contextFor($('#yourDropDown'));

Answer 3

你能提供一些代码吗？

如果除value绑定外还使用options绑定，KO viewmodel会自动更新：

<select data-bind="options: myOptions, value: myValue"></select>

Answer 4

就像4imble已经说过的那样，使用淘汰赛更好/更容易。因此，$(item).val(newVal)取代viewModel.dropdownObservable(newVal)，而不是ko.applyBindings({ value: ko.observable(1) }); var $select = $('#select'); // update the ViewModel value on change $select.change(function() { ko.contextFor(this).$data.value($select.val()); }); // change the value and trigger the change event $select.val(2).trigger('change');。

如果这不是您的选择，您可以更新select的更改事件上的viewmodel：

{{1}}

请参阅http://jsfiddle.net/sjroesink/P83kz/

如何在使用jQuery更新<select>下拉列表中的选定值后更新底层绑定KO数据？</select>

4 个答案:

的js

的HTML