2012-04-26 3 views
7

Mam następujący problem:predefiniować wybraną wartość w liście rozwijanej

Mam zaobserwowania tablicę obiektów w formacie { isSelected: false, Message: "Test1" }, { isSelected: true, Message: "Test2"}. Generuję listę wyboru w widoku z tej obserwowalnej tablicy. Chcę, aby wartość z właściwością isSelected = true została wstępnie wybrana (będzie to: Wiadomość: "Test2" w tym przykładzie). Tu jest mój kodu:

Knockout:

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> 

Fiddle: http://jsfiddle.net/PsyComa/RfWVP/52/

Wierzę, że to będzie proste, ale jestem bardzo nowy knockout i byłem nie można go uruchomić zgodnie z oczekiwaniami. Każda pomoc z działającym kodem zostanie bardzo doceniona. Dziękuję Ci.

Odpowiedz

10

Masz rację, to bardzo proste z knockout.js.

zauważalny może być związany z aktualnie wybranej opcji używając „wartość” wiązanie:

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

Teraz wystarczy użyć obiektu z „IsSelected == true” jako wartości początkowej to obserwowalne:

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

Dziękuję. Dokładnie to, czego potrzebowałem. – Mdb