Question

我使用这样的模板创建多个下拉列表：

    <script type="text/html" id="option-menu-template">
        <select data-bind='event: { change: myFunction( data, event) }, options:Options, optionsText:"Option",optionsValue:"ID",value: selection'></select>
    </script>
    <div data-bind="template: { name: 'option-menu-template', foreach: menuWrapper}"></div>

这会添加一个新的下拉列表：

        list.menuWrapper.push(new OptionMenu(data.DropDownOptions));

使用此viewmodel

function OptionMenu(data) {
    self.myFunction = function (data, event){
        if(event.target.value && event.target.value.indexOf("|") >= 0) 
        {
            changedMenu(event.target.value);
        }
    }
    return {
        Options: ko.observableArray(data),
        selection: ko.observable()
    }
}
function KnockoutModel() {
    var self = this;
    self.menuWrapper = ko.observableArray([]);
}

var list = new KnockoutModel();
ko.applyBindings(list );

进来的数据始终采用以下格式：

[{"Option":"---Select a *whatever*---","ID":"0"},
{"Option":"1st Choice","ID":"1"},
{"Option":"2nd Choice","ID":"32"}]
etc.

我希望第一个选项“---选择一个无论 ---”作为“占位符”，并且在实际下拉列表中不可见。我可以用这个

 $('select option:nth-child(1)').attr('hidden', 'hidden');

成功但是因为我创造了新的，我每次都要打电话，这有点麻烦。我想知道是否有更多的Knockout方法可以做到这一点？

Answer 1

请参阅http://knockoutjs.com/documentation/options-binding.html，注2。

optionsAfterRender回调允许您根据支持对象修改选项;该示例显示了如何禁用选项。

最好先禁用第一个选项，而不是直接隐藏它，否则将自动选择第一个值。如果您将已禁用的一个保留在列表中，如果没有预先选择的值，那么还有一种方法可以确定用户实际上没有选择任何值（用于验证目的）< / p>

在Knockout下拉列表中隐藏第一个选择选项

1 个答案: