2016-10-19 5 views
0

:あなたが見ることができるように実行列KendoGridとの合計とAngularJS

enter image description here

列を左には、列の実行中の合計が含まれています。例えば

  1. 9435 + 956 = 10391
  2. 9435 + 956 + 147 = 10538
  3. 9435 + 956 + 147 + 694 = 11232

私は剣道グリッドの基礎をよく知っていますが、この作業は今私の上です。私はどこから始めるべきかわかりません。前もって感謝します。

答えて

0

私はその値を保存するかどうか分かりませんが、視覚的な目的のためだけの場合は、列のテンプレートで十分です。グリッドの列の定義において

、あなたはこのようなあなたの「実行合計」欄を定義する必要があります

$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; 
      } 
     }, 
     ... 
    ], 
    ... 
}; 

を、私はそれをテストcouldntのが、それはこのようなものであるべき、と同じくらいあなたはあなたのデータソースに数万のデータ項目を持っていないので、あなたのパフォーマンスはこの単純な関数で損なわれるべきではありません。

しかし、私は前の要素のプロパティだけ「集計実行」(または何でもあなたはそれに名前を付ける)を読んで、グリッドのモデルに新しいプロパティを追加することを検討します:

$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 
      } 
     }, 
     ... 
    ], 
    ... 
}; 

私は多くの仮定しましたグリッドディレクティブのように、このアプローチのためのものは、すべての設定を内部に置くk-options = "mainGridOptions"を持っていますが、ドラフトとして、あなたに役立つことを願っています。