2017-09-05 43 views
1

嗯,我有两个问题让我担心很多......首先,我不知道如何给选择框设置默认值。在淘汰选择框中设置和修改一个值

而我我无法通过事件点击更改选择框的值...我创建了一个小提琴示例,如果有人可以给我一只手它将非常感激!

HTML

<select id="FilterBox" data-bind="value: siteGetOne"> 
    <option value="-2">City Wide</option> 
    <!-- ko foreach: sites --> 
    <option data-bind="text: name, value: $data"></option> 
    <!-- /ko --> 
</select> 

Selection Option Object : <span data-bind="text: siteGetOne"></span><br/> 
Selection Option name : <span data-bind="text: siteGetOne().name"></span><br/> 
Selection Option id : <span data-bind="text: siteGetOne().id"></span><br/> 

<a href="#" data-bind="click: setValue(1);">Set Value to 1</a> 
<a href="#" data-bind="click: setValue(2);">Set Value to 2</a> 
<a href="#" data-bind="click: setValue(3);">Set Value to 3</a> 

JS

var viewModel = function() { 
    var self = this; 
    setValue = ko.observable(); 

    self.sites = [ 
     { name: 'Site 1', id: 1}, 
     { name: 'Site 2', id: 2}, 
     { name: 'Site 3', id: 3} 
    ]; 

    self.siteGetOne = ko.observable(self.sites[2].id); 

    self.siteGetOne.subscribe(function (newValue) { 
     console.log(newValue); 
    }, self); 
} 

ko.applyBindings(new viewModel()); 

http://jsfiddle.net/xjYcu/276/

编辑最终版本http://jsfiddle.net/xjYcu/286/

回答

1

你可能想改变的东西。 这里是整个小提琴。 http://jsfiddle.net/xjYcu/283/

第一个是你应该使用选项绑定您的选择。

<select id="FilterBox" data-bind=" options: sites, 
      optionsText: 'name', 
      value: siteGetOne, 
      optionsCaption: 'Choose...'"> 

</select> 

也尝试改变你的点击绑定到这样的东西,所以你可以传入你的参数。

<a href="#" data-bind="click: function() {setValue(0)}">Set Value to 1</a> 
<a href="#" data-bind="click: function() {setValue(1)}">Set Value to 2</a> 
<a href="#" data-bind="click: function() {setValue(2)}">Set Value to 3</a> 
+0

感谢Bryan,我用OptionCaption编辑了我的主帖作为数组项 –