淘汰賽訂閱多選下拉列表

在採購訂單中，我希望根據價格和稅費計算所有行項目的總金額。對於每個項目，都有多種稅收。我爲此使用了敲除綁定。除了稅款部分，一切都可以工作當我添加新稅或刪除時，它不會更新總額。我嘗試了自定義綁定（更新），這似乎不適合我。淘汰賽訂閱多選下拉列表

https://jsfiddle.net/krishnasarma/r0doakyk/

HTML：

<table> 
<tbody data-bind='foreach: Entries'> 
<tr> 
    <td> 
    <input type="text" data-bind="value:Amount" /> 
    </td> 
    <td> 
    <select multiple data-bind="ddl1: null, SelectedOptions:Taxes"/> 
    </td> 
</tr>       
</tbody> 
</table> 
<input type="text" data-bind="value:$root.Total()" />

JS：

ko.bindingHandlers.ddl1 = { 
    init: function (element, valueAccessor, allBindings, viewModel, bindingContext) { 
     $(element).append('<option value=1>My tax 1</option>'); 
    $(element).append('<option value=2>My tax 2</option>'); 
    }, 
    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) { 
    alert(valueAccessor()); 
    } 
} 


function Entry(child) { 
    var self = this; 
    self.Amount = ko.observableArray(child.Amount); 
    self.Taxes = ko.observableArray(child.Taxes); 
} 
var VM = { 
    Entries: ko.observableArray([]), 
    Total: function(){ 
     var tot = 0; 
     for (var i = 0; i < VM.Entries().length; i++) { 
       var amt = parseFloat(VM.Entries()[i].Amount()); 
      var taxtot = 0; 
      for(var j=0;j<VM.Entries()[i].Taxes.length;j++){ 
        taxtot += amt*parseFloat(VM.Entries()[i].Taxes[j]); 
      } 
      tot +=taxtot; 
     } 
     return tot.toFixed(2); 

    } 
} 
$(function() { 
     VM.Entries().push(new Entry({})); 
    VM.Entries().push(new Entry({})); 
     ko.applyBindings(VM); 
});

來源

2016-02-26 Krishna Sarma

有在代碼中幾個問題：

你不需要自定義綁定爲多選擇稅收。在HTML，請嘗試：

<select multiple data-bind="options: $root.TaxOptions, optionsText: function(item) { return item.display; }, selectedOptions: Taxes"/>

然後在JavaScript：

self.TaxOptions = [{display: "My Tax 1", value: 1}, {display: "My Tax 2", value: 2}];

（參見下面的完整代碼的jsfiddle鏈接）

創建總計爲ko.computed觀察到的，因爲它是依賴在條目observable數組上。在上面的代碼

self.Total = ko.computed(function() { 
    var tot = 0; 
    for (var i = 0; i < self.Entries().length; i++) { 
     var amt = parseFloat(self.Entries()[i].Amount());  
     var taxtot = 0; 
     for(var j=0;j<self.Entries()[i].Taxes().length;j++){ 
       taxtot += amt*parseFloat(self.Entries()[i].Taxes()[j].value); 
     } 
     tot +=taxtot; 
    } 
    return tot.toFixed(2); 

    });

筆記，獲得稅收的值時，使用括號（），因爲它是可觀察到的陣列。

此的jsfiddle應該讓你在正確的軌道上：

https://jsfiddle.net/ombk322j/

來源

2016-02-26 17:10:15 lblu

淘汰賽訂閱多選下拉列表

回答

相關問題