使用淘汰赛预选下拉列表中的项目

时间:2013-03-23 15:48:39

标签: knockout.js

我有以下下拉列表:

<div>  
    Dummy
    <select data-bind="options: categories, optionsText: 'description', value: 2"></select>
</div>

使用下面的javascript:

function ViewModel()
{

    this.categories = ko.observableArray([
            new Category(1, "Non classé"),
            new Category(2, "Non nucléaire"),
            new Category(3, "Classe II irradié"),
            new Category(4, "Classe III")
    ]);

    // Constructor for an object with two properties
    function Category(id, description) {
        this.id = id;
        this.description = description;
    };
}

ko.applyBindings(new ViewModel());

我想在下拉列表中预先选择ID为2的元素。

有什么想法吗?

感谢。

jsFiddle:http://jsfiddle.net/RfWVP/276/

1 个答案:

答案 0 :(得分:7)

我可以想到两种方法来做到这一点。无论哪种方式,您都必须添加selectedCategory可观察属性来存储跟踪当前选定的选项。

  1. 使用optionsValue绑定并指定'id'作为您要用作value的{​​{1}}的属性:

    option

    然后将<select data-bind="options: categories, optionsText: 'description', value: selectedCategory, optionsValue: 'id'"> </select> 设为等于“2”:

    selectedCategory

    示例: http://jsfiddle.net/RfWVP/281/

  2. 在创建可观察的类别数组之前创建ID为“2”的类别,并将this.selectedCategory = ko.observable(2); 设置为等于该类别:

    selectedCategory

    示例: http://jsfiddle.net/RfWVP/280/

  3. 您使用哪一个取决于您对所选类别所需的信息。