KnockoutJSの個々のカートアイテムの数量を選択する方法

Question

こんにちは、ノックアウトするにはかなり新しいですし、私の配列を持っているように私はカートンの数量をドロップダウンから自動的に選択しています。ここに私のコードは次のとおりです。

VIEW

<div data-bind="foreach: cartItems"> 
    <h3 data-bind="text: fullname"></h3> 
    <p data-bind="text: sku"></p> 
    <select data-bind="quantityDropdown: number"></select> 
</div> 

のViewModel

var number = 50; 
ko.bindingHandlers.quantityDropdown = { 
    update: function (element) { 
     for (var i = 1; i < number + 1; i++) { 
      var selectedQty = ""; 

      for (var x = 0; x < self.cartItems().length; x++) { 
       var itemqty = parseFloat(self.cartItems()[x].qty, 10); 

       if (i === itemqty) { 
        selectedQty = " selected='selected'"; 
       } 
      } 
      // Add each option element to the select here 
      $(element).append("<option value='" + i + "' " + selectedQty + " class='quantity'>" + i + "</option>"); 
     } 
    } 
}; 

今私はカートで二つの項目を入れて、ドロップダウン表示されます。しかし、「選択された」番号はカートの両方の項目で同じですか？私はその項目を特定していないので、そのことを知っている。しかし、私はKnockoutjsでそれを特定のアイテムにする方法がわかりません。

Answer 1

の作業例： http://jsfiddle.net/GSvnh/5085/


ビュー：

<div data-bind="foreach: CartItems"> 
    <h3 data-bind="text: FullName"></h3> 
     <p data-bind="text: Sku"></p> 
     <select name="qty" class="form-control" data-bind="foreach: QuantityDropdown ,value:SelectedQuantity"> 
    <option data-bind="value: Value,text:Name"></option> 
    </select> 
</div> 

VM：あなたは `オペアンプを使用していないのはなぜ

$(function() { 
    var MainViewModel = function() { 
    var self = this; 
    self.CartItems = ko.observableArray([]); 
    //For example you get below array of objects as response 
    var response = [{ fullname: "ABC", sku: "1234567789", qty: 12 }, 
        { fullname: "AAA", sku: "2323227789", qty: 20 }, 
        { fullname: "BBB", sku: "2311227789", qty: 33 } 
    ]; 

    //you map your response and for each item you create a new CartItemViewModel 
    self.CartItems($.map(response, function (item) { 
     return new CartItemViewModel(item); 
    })); 

    } 

    var CartItemViewModel = function (data) { 
    var self = this; 
    var number = 50; 
    self.FullName = ko.observable(data.fullname); 
    self.Sku = ko.observable(data.sku); 
    self.QuantityDropdown = ko.observableArray(); 

    for (var i = 1; i < number + 1; i++) { 
     self.QuantityDropdown.push({ Value: i, Name: i }); 
    } 
    self.SelectedQuantity = ko.observable(parseFloat(data.qty, 10)); 
    self.SelectedQuantity.subscribe(function (newValue) { 
     alert("selected Qty : "+ newValue); 
    }) 
    } 
    ko.applyBindings(new MainViewModel()); 

    })