2012-04-26 16 views
7

で選択した値を事前に定義します。私は、この観測可能な配列からのビューで選択リストを生成しています。私はプロパティisSelected = trueを使用して値を事前選択する必要があります(この例では、メッセージ: "Test2")。は、私は、次の問題を持っているドロップダウンリスト

ノックアウト:

function ViewModel() 
{ 

    this.DummyOptions = ko.observableArray([{ isSelected: false, Message: "Test1" }, { isSelected: true, Message: "Test2"}]); 
    this.selectedValue = ko.observable(); 
} 

ko.applyBindings(new ViewModel()); 

HTML:ここに私のコードです

<div> 
Dummy 
<select id="dummy" data-bind="options: DummyOptions, optionsText: 'Message'"></select> 
</div> 

フィドル:私はこれは単純になりますが、私はノックアウトするのは非常に新しいですし、私がいたと信じてhttp://jsfiddle.net/PsyComa/RfWVP/52/

期待どおりに動作させることができません。作業コードの助けがあれば幸いです。ありがとうございました。

答えて

10

あなたはそうです、これは確かにknockout.jsで非常に簡単です。

観察できるが、「値」結合使って、現在選択されているオプションにバインドすることができます。ちょうどこの、観察の初期値として「真isSelected ==」を持つオブジェクトを使用して、今すぐ

<select data-bind="options: DummyOptions, 
        optionsText: 'Message', 
        value: selectedValue"></select> 

を:

function ViewModel() { 
    this.DummyOptions = ko.observableArray([...]); 

    // Filter the array to find the first element with isSelected == true 
    var selectedOption = ko.utils.arrayFirst(this.DummyOptions(), function(item) { 
     return item.isSelected; 
    }); 

    // Use this option as the initial value 
    this.selectedValue = ko.observable(selectedOption); 
} 

http://jsfiddle.net/RfWVP/54/

+0

ありがとうございました。ちょうど私が必要なもの。 – Mdb

関連する問題