使用复选框获取kendo网格中列的值

时间:2013-03-08 08:34:13

标签: kendo-ui kendo-grid

我有一个带复选框的网格

                        @(Html.Kendo().Grid<Re.Web.ReService>()
                    .Name("ServiceList")
                        .Columns(columns =>
                        {
                            columns.Bound(p => p.PKiServiceID)
                            .ClientTemplate("<input name=\"selectedIds\" type=\"checkbox\" value=\"#=PKiServiceID#\" class=\"chk\"/>")
                            .HeaderTemplate("<input type=\"checkbox\" class=\"selectAll\" />")
                            .Width(30);
                            columns.Bound(p => p.SServiceName).Width(200);
                            columns.Bound(p => p.MServicePrice).Width(80);
                            columns.Bound(p => p.BStatus).Width(70).ClientTemplate("#if(BStatus){# #='Y'# #} else {# #='N'# #}#");
                            columns.Bound(p => p.SDescription);
                        })
                    .Selectable()
                    .Pageable()
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .Model(model => model.Id(p => p.PKiServiceID))
                        .Read(read => read.Action("ServiceRead", "Home"))
                    )
                    )

和javascript

    $(document).ready( function () {
    var grid = $("#ServiceList").data("kendoGrid");

    //handle the click of the header checkbox
    grid.table.on("change", ".selectAll", function () {
        var checkbox = $(this);
        if (checkbox.is(':checked')) {
            grid.table.find("tr")
                .find("td:first input")
                .attr("checked", checkbox.is(":checked"));

        }
        else {
            grid.table.find("tr")
                .find("td:first input")
                .attr("checked", checkbox.is(":checked"));
        }
    });
});

我可以检查/取消选中网格中的所有行 现在我想要,如果我点击全选复选框,我得到MServicePrice列的所有值,这样我就可以计算总值。我尝试使用$(this).closest('tr'),但它无效

1 个答案:

答案 0 :(得分:2)

检查内部所有处理程序意味着网格中的所有项目都将被检查,因此您正在询问如何获取所有项目的值基本上?

您可以使用dataSource并遍历view()集合。

e.g。

function checkAll(ele) {        
    var grid = $('#gridName').data().kendoGrid;
    var total = 0;
    $.each(grid.dataSource.view(), function () {           
        total += this.Salary;            
    });
    alert(total);        
}