私は様々な画像カテゴリのドロップダウン持ってノックアウトドロップダウンから

Question

をテキスト値を取得します。私のJavaScriptで

<select class="form-control" data-bind="options: imageCategoryList, value: 'Category', optionsCaption: --Select Category--, optionsText: &#39;Category&#39;, optionsValue: 'Category', event: {change: GetImages}" id="Category" name="Category"></select>

、私はそのドロップダウンリストで選択されているもののテキスト値を取得しようとしているが、しかし、私はそれを行う方法がわかりません。私のviewModelでは、私は

var img = self.imageCategoryList().Text 

ですが、 "undefined"しか返しません。選択したテキスト値を取得するにはどうすればよいですか？

ありがとうございます！

Answer 1

...

の作業フィドル： http://jsfiddle.net/bPP5Q/33/

ビュー...

<select class="form-control" data-bind=" 
    options: imageCategoryList, 
    value: selectedCategory, 
    optionsCaption: '--Select Category--', 
    optionsText: function(item){ return item.Category }, 
    event: {change: getImages}" 
id="Category" name="Category"></select> 

とのviewmodel ...

jQuery(function ($) { 
    // this runs after the window loads 
    var ViewModel = function (data) { 
    var self = this; 

    self.imageCategoryList = ko.observableArray([ 
     { 
     Category: 'A', 
     Text: 'CategoryA' 
     }, 
     { 
     Category: 'B', 
     Text: 'CategoryB' 
     }, 
     { 
     Category: 'C', 
     Text: 'CategoryC' 
     } 
    ]); 

    self.selectedCategory = ko.observable(); 

    self.selectedCategory.subscribe(function(newValue) { 
     console.log(newValue.Text); 
    }); 

    self.getImages = function(){}; 
    } 


    var vm = new ViewModel(); 

    ko.applyBindings(vm); 

}); 

Answer 2

選択したオプションを観測対象にバインドする必要があります。 スヨンは、モデルにあなたが作成します。

self.selectedCategory = ko.observable(); 

とで

あなたの選択

<select class="form-control" data-bind="options: imageCategoryList, value: selectedCategory, optionsCaption: --Select Category--, optionsText: 'Category', optionsValue: 'Category', event: {change: GetImages}" id="Category" name="Category"></select> 

そして、あなたのJavaScriptでは、あなたは、これはテストされていません

var img = modelObject.selectedCategory(); 

のようにアクセスすることができますが、それはスタートです。私は、これはあなたがここで達成しようとしているものかもしれないと思う