bootstrap selectpicker knockoutjs disableオプション

Question

私はjs fiddleに次のバインディングを持っています。 IsDisabledその後、私は選択でオプションを無効にする方法を知っていただきたいと思い

this.teamItems = ko.observableArray([{ 
     text: 'Chris', 
     id: 1, 
     IsDisabled: false 
    }, { 
    text: 'Peter', 
    id: 2, 
    IsDisabled: false 
}, { 
    text: 'John', 
    id: 3, 
    IsDisabled: false 

}]); 

を追加：

<div class="container body-content"> 
    <div>Name : <span data-bind="text: Name"></span> 
    </div>The select control should be below 
    <select multiple data-bind="selectPicker: teamID, optionsText: 'text', optionsValue : 'id', selectPickerOptions: { optionsArray: teamItems, disabledOption: IsDisabled }"></select> 
    <div>Selected Value(s) 
     <div data-bind="text: teamID"></div> 
    </div> 
</div> 

私はこれをやってdisabledOptionを考えています。

Answer 1

knockout docsには、optionsAfterRenderメソッドを使用してアイテムを無効にする方法の例があります。あなたはそれに渡すことができる方法について

：

それはないアイテムで、あなたのviewmodelにしておく必要があり

• それは、オプションのHTMLノードを取り込み、アイテムは、それが
にバインドされています

したがって、どのアイテムが無効になっているかを保存する場所を見つけることです。最も簡単なオプションは、あなたのteamItems「オブジェクト内に格納することです：

{ 
    text: 'Chris', 
    id: 1, 
    disable: ko.observable(true) 
} 

は今、私たちは、アイテムを取り込んで、バインディングを作成するメソッドを追加する必要があります。私たちは、ストレートの例からこれを取ることができます。

this.setOptionDisable = function(option, item) { 
    ko.applyBindingsToNode(option, { 
    disable: item.disable 
    }, item); 
} 

は最後に、私たちは、このメソッドを呼び出すためにノックアウトを指示する必要があります：

<select multiple data-bind="optionsAfterRender: setOptionDisable, ... 

注意をすることをあなたの項目の一つでdisableプロパティを変更した後、あなたを」手動でteamItems.valueHasMutatedに電話する必要があります。

http://jsfiddle.net/nq56p9fz/

：ここ

が更新フィドルです