Select 自动重置并通过参数敲除捕捉值更新

Select 自动重置并通过参数敲除捕捉值更新,select,knockout.js,reset,computed-observable,Select,Knockout.js,Reset,Computed Observable,我正在使用Knockout JS,并试图创建一个简单的UI,其中使用一系列下拉菜单来触发一个动作,该动作取决于参数值 e、 g.如果我有一个页面给出了两辆车的详细信息,并且我想将它们分配给下拉列表中的值 最简单的方法是,使用knockout提供一个参数,告诉我它是vehicle one还是vehicle two,并在选择后立即重置下拉列表 我已经尝试了值绑定计算的可观测值,但是我无法让select在选择后立即重置自己 我尝试在javascript中使用一个标准函数,并使用bind函数传递参数,但

我正在使用Knockout JS,并试图创建一个简单的UI,其中使用一系列下拉菜单来触发一个动作,该动作取决于参数值

e、 g.如果我有一个页面给出了两辆车的详细信息,并且我想将它们分配给下拉列表中的值

最简单的方法是,使用knockout提供一个参数,告诉我它是vehicle one还是vehicle two,并在选择后立即重置下拉列表

我已经尝试了值绑定计算的可观测值,但是我无法让select在选择后立即重置自己

我尝试在javascript中使用一个标准函数,并使用bind函数传递参数,但这没有帮助

到目前为止,这就是我所拥有的,但我有两个问题:

更改select的值似乎不会调用write函数 如果我对它做了足够多的处理,我可以让它调用write函数,但是如果不借助纯DOM操作将box设置回第一个选项,我就找不到方法。 注意,我尝试了两种不同的方法来绑定updateAssignment函数,但它们似乎都不起作用


这是需要自定义绑定还是扩展绑定?还是我缺少了一种更简单的方法?

我不确定这是否是一个很好的用户界面,很难使用键盘导航和选择。尽管如此,这并不难实现。由于读取值永远不会更改,因此我们需要确保在调用write函数时通知订阅者,从而更新绑定的DOM元素,即使读取值自上次以来没有更改

旧的答案包含了一个解决方案,使用了两个观察值和一个手动订阅,可以在上看到。这个被编辑的答案更新了的fiddle at使用了两个观察值,其中一个是可写的计算观察值,因为这是在注释中请求的

按如下方式绑定select元素:

<select data-bind="options: $parent.drivers,
                   optionsText: 'name',
                   value: selectedDriver,
                   optionsCaption: 'Select driver'">
</select>

你好,罗伯特。感谢您向我展示这个解决方案,我将更详细地介绍它,但它似乎使用了foreach:绑定而不是参数传递来区分车辆。我特别感兴趣的是涉及将参数传递到计算的可观测函数的技术-很抱歉,这在问题中没有得到足够的强调。我不确定将参数传递到计算的可观测函数是什么意思。计算出的可观测值不应该是多参数函数,因为你会使用普通函数。如果您的计算可观测值需要多个值来计算返回值,它应该读取viewModel或this或self对象上的属性。然而,我已经更新了答案,使用了一个可写的计算可观察对象。听起来好像我找错了方向。是否可以使用常规函数代替观测值,但仍有淘汰更新显示?我认为我遇到问题的原因是,我试图找到方法为页面上的多个框重用viewModel中的函数。而我开始看到的是,击倒并不是真的那样工作?最终,多亏了你的帮助,我以与你的修订解决方案类似的方式解决了它,即计算的观测值,但我放弃了参数概念,而是使用了两种不同的观测值-vehicle1SelectedDriver和vehicle2SelectedDriver。如果你问我,将这些可观测的物体放在实际的车辆物体上可能是最容易的。这可能是他们的归属,对你来说也会容易得多。
function CarViewModel(data){
    var self = this;

    // ... removed other properties for brevity

    self.todaysDriver = ko.observable();
    self.selectedDriver = ko.computed({
        read: function(){
            return undefined;
        },
        write: function(newValue){
            if (newValue){
                self.todaysDriver(newValue);
                self.selectedDriver.notifySubscribers();
            }
        }
    });
}