淘汰赛链接 DropDownList ko.observableArray() - 选择的插件答案

【问题标题】：Knockout linked DropDownList ko.observableArray() - chosen plugin淘汰赛链接 DropDownList ko.observableArray() - 选择的插件
【发布时间】：2013-04-23 09:02:56
【问题描述】：

主要问题是我需要链接两个选择。当我在第一个选择一个国家时，第二个必须显示所选国家的州。

我得到了什么，自定义绑定：

 ko.bindingHandlers.chosen = {
        init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
            $(element).chosen();            
        },
        update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
            $(element).trigger("liszt:updated");         
        }
};

var viewModel = {
Comunidades : ko.observableArray([
    {"name": "Comunidad Valenciana" ,
     "id" : 0, "provincias": 
        [{"name" : "Alicante", "id": 0},
         {"name": "Valencia", "id" : 1},
         {"name": "Castellon", "id" : 2}
        ] } ,
    {"name": "Madrid" , "id" : 1 },
    {"name": "Murcia" , "id" : 2 }]
),
    ]),
selectedOne : ko.observableArray(),

ko.applyBindings(viewModel);

这样我会在 HTML 选择中显示第一个数组，但我不知道如何在第一个选项中显示“Provincias”。

我会尝试做一个演示。

<link rel="stylesheet" href="http://harvesthq.github.com/chosen/chosen/chosen.css" />  
<select data-bind="options: Comunidades , value: selectedOne, chosen : true, optionsText: 'name', optionsValue: 'id'   "  class="chzn-select" style="width:300px;" ></select>

<select data-bind="options: Comunidades , value: selectedTwo, chosen : true, optionsText: 'name', optionsValue: 'id'   "  class="chzn-select" style="width:300px;" ></select>

<p data-bind="text: selectedOne"></bind>
<p data-bind="text: selectedTwo"></bind>

http://i.imgur.com/shqlFVp.png?1

【问题讨论】：

你看起来像这样吗jsfiddle.net/johnpapa/vGg2h
完美契合是你的吗？如果是，请立即作为答案发布，我将尝试禁用第二个选择。
不，我不敢说是我的 :) 因为这是由约翰爸爸制作的 - 他是 SPA 大师
如果您愿意，您仍然应该将其作为答案发布并归功于爸爸，您仍然提供了答案！

标签： knockout.js jquery-chosen

【解决方案1】：

http://jsfiddle.net/benfosterdev/wHtRZ/

])

这是我启发的示例。使用带有 Knockout 的级联下拉列表，也有助于 Papa 示例。

【讨论】：