Foreach Checked並點擊事件淘汰賽

Question

我想在淘汰賽的基礎上添加基於複選框選中事件的'Cost'值。

<tbody data-bind="foreach: $root.searchedResults"> 
    <!-- ko if: Id--> 
    <tr> 
     <td data-bind="text: Id"></td> 
     <td data-bind="text: Cost"></td> 
     <td><input type="checkbox" data-bind="checked: $root.searchedResults().length > 0, click: $root.Hospital_click"></td> 
    </tr> 
    <!-- /ko --> 
</tbody> 

和成本總和應顯示在

<div data-bind="text: ko.toJSON(SumofItems)"></div> 

click事件沒有更新我的總和爲基礎的選擇。有人可以幫忙嗎？

self.Hospital_click = function() { 
    //Suggest 
} 

我的視圖模型爲：

var SearchModel = function() { 

    var self = this; 
    self.searchFromDate = ko.observable('01/01/2014'); 
    self.searchToDate = ko.observable('01/01/2016'); 

    self.searchedResults = ko.observableArray([]); 

    self.search = function() { 


     var model = { 
      BeginDate: self.searchFromDate(), 
      EndDate: self.searchToDate() 
     }; 

     $.ajax({ 
      url: '@Url.Action("SearchSpend", "Analysis", new { Area = "Portal" })', 
      type: 'POST', 
      contentType: 'application/json; charset=utf-8', 
      dataType: "json", 
      data: ko.toJSON(model), 

      success: function (response) { 
       self.searchedResults(response); 

      } 
     }); 

    }; 

Answer 1

你可以添加一個新的observableArray與選擇的結果（selectedResults）的ID的。該視圖模型可能是：

function Result(id,cost) { 
     this.Id = id; 
     this.Cost = cost; 
    } 

    function viewModel() { 

     var self = this; 

     self.searchedResults = ko.observableArray([]); 

     self.selectedResults = ko.observableArray([]) 

     self.totalCost = ko.computed(function() { 
      let total = 0; 
      for(let p = 0; p < self.searchedResults().length; ++p) 
      { 
       if (self.selectedResults.indexOf(self.searchedResults()[p].Id)>=0){ 
        total += self.searchedResults()[p].Cost; 
       } 
      } 
      return total; 
     }); 

    }; 

totalCost將返回Cost場的總和爲所有選定的結果。

和視圖可能是這樣的：

<table data-bind="foreach: searchedResults"> 
     <tr> 
      <td data-bind="text: Id"></td> 
      <td data-bind="text: Cost"></td> 
      <td><input type="checkbox" value="" data-bind="checkedValue: Id, checked: $parent.selectedResults"></td> 
     </tr> 
    </table> 

    <div data-bind="text: totalCost"></div>  

totalCost是返回Cost的德總和只有選擇結果的計算值。

這是fiddle。

在小提琴中，數據來自數組listOfResults。在你的情況下，這來自success函數（Ajax請求）;在這個功能中你還需要清除selectedResults。