Блог

Я начну прямо с примера:

Как вы можете видеть, левый столбец содержит текущую сумму правого столбца.

Например:

1. 9,435 956 = 10,391
2. 9,435 956 147 = 10,538
3. 9,435 956 147 694 = 11,232
4. и т.д.

Я знаком с основами kendo-grid, но эта задача сейчас выше меня. Я не знаю, с чего начать. Заранее спасибо.

Я не знаю, хотите ли вы сохранить это значение, но если это просто для визуальных целей, шаблона для столбца должно быть достаточно.

В определении столбцов вашей сетки вы должны определить свой столбец «Текущая сумма» следующим образом:

 $scope.mainGridOptions = {
    ...
    columns: [
        { 
            title: "Running Sum", 
            template: function (dataItem) {
                //This function is applied for each dataitem in your datasource
                var dataSource=dataItem.parent();//Get the full dataSource
                var index=dataSource.indexOf(dataItem);//Get the index of the dataItem in the dataSource
                if(index>0){
                    //Iterate to get the total
                    for(var i=0,total=0;i<=index;i  ){
                        total =dataSource[i].Price;
                    }
                    return total;
                }
                else return dataItem.Price;
            }
        },
       ...
    ],
    ...
};
  

Я не смог это протестировать, но это должно быть что-то вроде этого, и, поскольку у вас нет десятков тысяч элементов данных в вашем источнике данных, ваша производительность не должна быть скомпрометирована с помощью этой простой функции.

Тем не менее, я бы подумал о том, чтобы добавить новое свойство в модель сетки, прочитайте только свойство «runningSum» (или как вы его называете) предыдущего элемента:

 $scope.mainGridOptions = {
    dataSource:{
        schema:{
            model:{
                ...
                fields:{
                    ...
                    Price:{type:"number",editable:true,defaultValue:0}
                    runningSum:{type:"number",editable:false,defaultValue:0}
                    //new property,dont worry for editable false, it will still allowed 
                    //to be modified programatically and will be avoided
                    //in case of "editable":"popup"
                }
            }
        }
    },
    ...
    columns: [
        { 
            title: "Running Sum", 
            template: function (dataItem) {
                //This function is applied for each dataitem in your datasource
                var dataSource=dataItem.parent();//Get the full dataSource
                var index=dataSource.indexOf(dataItem);//Get the index of the dataItem in the dataSource
                if(index>0){
                    dataItem.runningSum=dataItem.Price   dataSource[index-1].runningSum;
                }
                else{
                    dataItem.runningPrice=dataItem.price;
                }
                return dataItem.runningPrice
            }
        },
       ...
    ],
    ...
};
  

Я предполагал многое для этого подхода, например, в вашей директиве grid есть k-options =»mainGridOptions», в который вы помещаете всю конфигурацию, но в качестве черновика, я надеюсь, это может быть вам полезно.