意味的UIの選択KnockoutJSを使ったドロップダウン

誰もこれをこれまでに試したことがありますか？セマンティックUIのドロップダウンをKnockoutJSと統合する方法はありますか？私のフォームにそれを統合したいので、selectを使ってドロップダウンを選択することをお勧めします。意味的UIの選択KnockoutJSを使ったドロップダウン

出典

2017-06-09 Toro

はい、何をしますか？ここで

だと例：

<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>

出典

2017-06-10 21:17:00 Mike

を見ることができ、このHTMLのような選択

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

ノックアウトビューモデル

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());

を使用してそれを行うことができますそれは私の上で動作しません。私はselectでconvertメソッドを使ってみました。ような何か： <選択したクラス= "UIのドロップダウンメニューの" データバインド= "foreachの：$ root.availableTipeBarang"> \t \t \t \t \t \t \t \t \t \t \t \t <オプションデータバインド= "テキスト：、NAMA ATTR ：{ 'データ値'：ID} "> \t \t \t \t \t \t \t \t \t \t \t – Toro

私は同じ問題を抱えていたし、道を考え出しました。この問題は、knockout.jsによって生成された空のオプション値にあるようです。ノックアウト後にオプションに値を割り当てると、ドロップダウンを初期化して問題を解決しました。

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

出典

2017-06-20 08:17:27

はいあなたはあなたが私はあなたのソリューションを試みたが、まあデモjsFiddle

出典

2017-12-08 09:43:36

意味的UIの選択KnockoutJSを使ったドロップダウン

答えて

関連する問題