Question

我在模型中使用计算字段设置了以下Kendo UI网格。

执行时，此网格正确加载，但在每个单元格中显示模型的cost函数的实际源代码，而不是预期的计算值：

如果我点击单个单元格，它实际上会显示计算值：

汇总页脚行始终显示相同的代码，我无法让它打印值。

我发布了一个正在运行的示例at Kendo's dojo。

<div id="item_65_lineItems" data-field-name="item[65][lineItems]"></div>
<script>
jQuery(function(){
    var json = {
    "columns": [{
        "field": "line_no",
        "title": "Line No.",
        "width": "15%"
    }, {
        "field": "description",
        "title": "Description",
        "width": "60%"
    }, {
        "field": "qty",
        "title": "Qty",
        "width": "10%",
        "footerTemplate": "Sum: #=sum#"
    }, {
        "field": "cost",
        "title": "Cost",
        "width": "15%",
        "footerTemplate": "Sum: #=sum#"
    }],
    "dataSource": {
        "data": [{
            "line_no": 1,
            "description": "Test line item",
            "qty": 15
        }, {
            "line_no": 1.1,
            "description": "test 1",
            "qty": 12
        }, {
            "line_no": 2,
            "description": "test 2",
            "qty": 16
        }, {
            "line_no": 3,
            "description": "test 3",
            "qty": 15
        }, {
            "line_no": 4,
            "description": "test 4",
            "qty": 12
        }, {
            "qty": 12,
            "line_no": 5,
            "description": "test 5"
        }],
        "aggregate": [{
            "field": "qty",
            "aggregate": "sum"
        }, {
            "field": "cost",
            "aggregate": "sum"
        }]
    },
    "editable": {
        "createAt": "bottom"
    },
    "pageable": false,
    "toolbar": [{
        "name": "create"
    }]
};
    json.dataSource.schema = {

        model: {
            cost: function () {
                return this.qty * 100;
            }
        }
    };
    //json.dataSource = new kendo.data.DataSource(json.dataSource);
    console.log(json);
    jQuery("#item_65_lineItems").kendoGrid(json);
});
</script>

Answer 1

您可以使用模板执行该功能：

{
    "field": "cost",
    "title": "Cost",
    "width": "15%",
    "footerTemplate": "Sum: #=sumCosts()#",
    "template": "#=cost()#"    

}

页脚似乎比较棘手，但您可以调用其他函数来获取值：

var sumCosts = function () {
    var ds = $("#item_65_lineItems").data("kendoGrid").dataSource;
    var aggregates = ds.aggregates();

    return aggregates.qty.sum * 100;
};

here's a sample

为什么我的Kendo Grid的模型计算字段显示函数的代码？

1 个答案: