Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
Last revision Both sides next revision
wiki:pivotexample [2014/02/17 15:17]
tony
wiki:pivotexample [2014/02/17 15:33]
tony
Line 96: Line 96:
    }, {    }, {
        ​dataName:​ '​ProductName',​        ​dataName:​ '​ProductName',​
-       ​label:​ '​Product,​+       ​label:​ '​Product',
        ​width:​ 90        ​width:​ 90
    }    }
Line 126: Line 126:
            ​aggregator : '​sum', ​            ​aggregator : '​sum', ​
            ​width:​50,​            ​width:​50,​
-           ​label:'​Sum ​Price'+           ​label:'​Sum'​
         }, {         }, {
            ​member : '​Quantity', ​            ​member : '​Quantity', ​
            ​aggregator : '​sum', ​            ​aggregator : '​sum', ​
            ​width:​50,​            ​width:​50,​
-           ​label:'​Sum Qty'+           ​label:'​Qty'​
         }         }
 ] ]
 </​code>​ </​code>​
  
 +The missed settings are how we can make sumaries on columns and rows. This of cource is achieved with two line of code - \\
 +rowTotal : true and \\
 +colTotal: true
 +
 +The final code with jqGrid setting is:
 +
 +<code javascript>​
 +<script type="​text/​javascript">​
 +jQuery(document).ready(function(){
 +
 + jQuery("#​grid"​).jqGrid('​jqPivot', ​
 + "​data1.json",​
 + // pivot options
 + {
 + xDimension : [
 +                   ​{dataName:​ '​CategoryName',​ label : '​Category',​ width: 90}, 
 +                   ​{dataName:​ '​ProductName',​ label : '​Product',​ width:90}
 +                ],
 + yDimension : [
 +                   ​{dataName:​ '​Country'​}
 +                ],
 + aggregates : [
 + {member : '​Price',​ aggregator : '​sum',​ width:50, label:'​Sum'​},​
 + {member : '​Quantity',​ aggregator : '​sum',​ width:50, label:'​Qty'​}
 + ],
 + rowTotals:​ true
 + colTotals : true
 +
 + }, 
 + // grid options
 + {
 + width: 700,
 + rowNum : 10,
 + pager: "#​pager",​
 + caption: "​Amounts and quantity by category and product"​
 + });
 +});
 +</​script>​
 +  </​head>​
 +  <​body>​
 +...
 +     <​table id='​grid'></​table>​
 +     <​div id='​pager'></​div>​
 +...
 +   </​body>​
 +</​html>​
 +</​code>​
 +
 +The final result can look like this
 +
 +{{:​wiki:​amtbycatprod.png|}}
  

QR Code
QR Code wiki:pivotexample (generated for current page)