Question

我想添加＆＃39;费用＆＃39;基于复选框检查事件敲出。

<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>

点击事件未更新基于总和的选择。有人可以帮忙吗？

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，其中包含所选结果的ID（selectedResults）。 viewmodel可以是：

    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。

Foreach选中并点击事件淘汰赛

1 个答案: