Semantic UI Selection Dropdown mit KnockoutJS

Question

Also, hat das schon mal jemand probiert? Gibt es eine Möglichkeit, Semantic UI Dropdown mit KnockoutJS zu integrieren? Vorzugsweise Auswahl Dropdown mit Auswahl, weil ich das auf meinem Formular integrieren möchte.

Answer 1

Ja, was möchten Sie tun?

hier und Beispiel:

<div class="ui selection dropdown" id="ProjectDD"> 
    <input type="hidden" name="project"> 
    <i class="dropdown icon"></i> 
    <div class="default text">Project...</div> 
    <div class="menu" data-bind="foreach: ProjectCollection"> 
     <div class="item" data-bind="text: name, attr: {'data-value':id}"> 
     </div> 
    </div> 
</div> 

Answer 2

Ich hatte gerade das gleiche Problem und eine Art und Weise herausgefunden. Das Problem scheint mit den leeren Optionswerten zu sein, die von knockout.js erzeugt werden. Das Zuweisen von Werten zu Optionen nach dem Knockout ist also gebunden, und das Initialisieren des Dropdowns hat das Problem gelöst.

//after ko.applyBindings 
var i=1; 
$("#dropdown > option").each(function() { 
    this.value=i; 
    i++; 
}); 
$('.ui.dropdown').dropdown(); 

Answer 3

Ja, Sie können es wie diese HTML

<div class="ui form"> 
    <div class="field"> 
     <select data-bind="options: optionsText, 
          value: selectedOption, 
          optionsCaption: 'Select Options'"> 
     </select> 
    </div> 
</div> 

Und Knockout Ansicht Modell

var ViewModel = function() { 
    var self=this; 
    self.optionsText=ko.observableArray(['Some','Thing','Like','This']); 
    self.selectedOption=ko.observable(); 
    self.selectedOption.subscribe(function(newValue) { 
     alert("Selected value " + newValue); 
    }); 
}; 
ko.applyBindings(new ViewModel()); 

mit select tun können Sie Demo jsFiddle