2017-09-05 50 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編輯了我的主帖作爲數組項 –