ノックアウトを使用してドロップダウンリストから選択した値を取得する方法

Question

私はノックアウトを使用して、変更イベントでjavascriptで選択したアイテムのIDを取得しようとしています。

my.viewModels.PlatformsViewModel = function() { 
    var self = this; 

    self.platforms = ko.observableArray(); 
    self.message = ko.observable(); 

    self.loadMedias = function (data, event) { 
     my.loadMedias(data.id); 
    } 
} 

を次のようにここに私のhtmlが

<div id="platforms" data-bind="with: platformsViewModel"> 
      <p> 
       Selected Platform: 
       <select data-bind="options: platforms, optionsText: 'displayName', value: 'id', optionsCaption: 'Choose...', event: { change: loadMedias }" ></select> 
      </p> 
     </div> 

である私のビューモデルは、私がここで何をしないのですのですか？なぜ入れないで、

<select data-bind="options: platforms, optionsText: 'displayName', optionsValue: 'id', optionsCaption: 'Choose...', event: { change: loadMedias }" ></select> 
                   <!--^here --> 

---

しかし：

Answer 1

それは、このようなあなたはおそらくあなたが結合optionsValueを使用すべき場所結合valueを使用している簡単な修正であってもよく見えますむしろ、あなたのビューでよりビューモデルでロジック、：

my.viewModels.PlatformsViewModel = function() { 
    var self = this; 

    self.platforms = ko.observableArray(); 
    self.message = ko.observable(); 

    //new observable to hold selected platform 
    self.selectedPlatform = ko.observable(); 
    //subscribe to changes in the observable value to trigger the loading 
    self.selectedPlatform.subscribe(function(newValue) { 
     my.loadMedias(newValue.id); 
    }); 
} 

し、更新<select> THA

<select data-bind="options: platforms, optionsText: 'displayName', value: selectedPlatform, optionsCaption: 'Choose...'" ></select> 

Answer 2

HTML：：jsの中

<select name="ddlUsers" id="ddlUsers" class="form-control" 
          data-bind="options: ViewModel.CashierPage.AvailableCash, optionsText: 'OptionTextInfo', value: ViewModel.CashierPage.CashSelected, optionsCaption: 'Cassa...'"></select> 

：tはむしろちょうどそのIDよりも、選択された実際のプラットフォームのオブジェクトを結合するビューモデルで

public CashSelected: KnockoutObservable(); 
... 
self.CashSelected = ko.observable(null); 
self.CashSelected.subscribe(function(valueNewValue){/*your code*/});