2012-04-26 12 views
7

Ich habe folgendes Problem:vordefinieren den ausgewählten Wert in Dropdown-Liste

Ich habe eine beobachtbare Array von Objekten im Format { isSelected: false, Message: "Test1" }, { isSelected: true, Message: "Test2"}. Ich erzeuge eine Auswahlliste in der Ansicht von diesem beobachtbaren Array. Ich möchte, dass der Wert mit der Eigenschaft isSelected = true vorgewählt wird (das ist: Nachricht: "Test2" in diesem Beispiel). Hier ist mein Code:

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/

Ich glaube, das einfach sein wird, aber ich bin sehr neu zu KO und ich war nicht in der Lage, es wie erwartet funktionieren zu lassen. Jede Hilfe mit funktionierendem Code wird sehr geschätzt. Danke.

Antwort

10

Sie haben Recht, das ist in der Tat sehr einfach mit knockout.js.

Eine beobachtbare kann auf die aktuell ausgewählte Option gebunden werden, um den „Wert“ Bindung mit:

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

Jetzt, benutzen Sie einfach das Objekt mit „isSelected == true“ als Anfangswert dieser beobachtbaren:

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

danken Ihnen. Genau das, was ich brauchte. – Mdb

Verwandte Themen