Jquery 如何使用knockoutjs从下拉列表中自动选择值?

Jquery 如何使用knockoutjs从下拉列表中自动选择值?,jquery,knockout.js,Jquery,Knockout.js,我有两个下拉列表。我想从第一个地址中选择一个地址,然后根据countrycode自动从第二个下拉列表中选择一个国家。我有一个subscribe方法,当选择地址时,它永远不会被触发。以下是我到目前为止所做的,我正在使用KnockoutJs 在此处输入代码 尝试使用计算方法,而不是订阅。检查下面的代码 <ul data-bind="foreach: items"> <li> <select data-bind="options: $parent.Address

我有两个下拉列表。我想从第一个地址中选择一个地址,然后根据countrycode自动从第二个下拉列表中选择一个国家。我有一个subscribe方法,当选择地址时,它永远不会被触发。以下是我到目前为止所做的,我正在使用KnockoutJs

在此处输入代码


尝试使用计算方法,而不是订阅。检查下面的代码

<ul data-bind="foreach: items">
<li>

    <select data-bind="options: $parent.Address,
                       optionsText: 'name',
                       value: state"></select>
    <select data-bind="options: Countries, value: country"></select>
 </li>
</ul>


var Item = function(name){
var self = this;

self.state = ko.observable("");
self.country = ko.observable("");
self.Countries = ko.computed(function(){
    if(self.state() == "" || self.state().Countries == undefined)
        return [];
    return self.state().Countries;
});
};

var ViewModel = function(data) {
var self = this;
self.Address = data;
self.items = ko.observableArray([new Item("First")]);
};
};

var data = [
{name: "12 ball road", Countries: [
   "UK", "Uk1", "Uk2" 
]},{name: "12 kent road", Countries: [
   "PK", "PK1", "PK2" 
]},{name: "11 withy close", Countries: [
   "DL", "DL2", "DL3" 
]},
];

 ko.applyBindings(new ViewModel(data));
变量项=函数(名称){ var self=这个; self.state=ko.可观察(“”); self.country=ko.可观察(“”); self.Countries=ko.computed(函数(){ if(self.state()==“”| | self.state().Countries==未定义) 返回[]; 返回self.state().国家; }); }; var ViewModel=函数(数据){ var self=这个; self.Address=数据; self.items=ko.observearray([新项目(“第一”)]); }; }; 风险值数据=[ {名称:“12 ball road”,国家:[ “英国”、“英国1”、“英国2” ]},{名称:“肯特路12号”,国家:[ “PK”、“PK1”、“PK2” ]},{名称:“11 withy close”,国家:[ “DL”、“DL2”、“DL3” ]}, ]; 应用绑定(新视图模型(数据));
您的代码中有许多语法错误,请参阅最终版本。我将您的订阅功能重写如下:

this.selectedAddress.subscribe(function(value){
    var country = ko.utils.arrayFirst(self.countriesArray(), function(item) { 
        return item.CountryCode === value; 
    });
    self.selectedCountry(country);
});
其中,
self
是保存视图模型的变量。在标记中,您忘记在选项绑定中使用
value

<select data-bind="options: Addresses, optionsText: 'Address', optionsValue: 'CountryCode', value: selectedAddress"></select>


countriesArray
应该是可观察的,而不仅仅是可观察的。所有这些都在我上面提到的JSFIDLE中。

您检查过答案了吗?他们中有人成功了吗?如果是的话,你能接受吗?