<c1-pivot-engine id="dataSourceEngine" source-key="dataset10">
<c1-view-field-collection c1-property="RowFields" items="Country"></c1-view-field-collection>
<c1-view-field-collection c1-property="ColumnFields" items="Product"></c1-view-field-collection>
<c1-view-field-collection c1-property="ValueFields" items="Sales"></c1-view-field-collection>
</c1-pivot-engine>
<c1-pivot-panel items-source-id="dataSourceEngine"></c1-pivot-panel>
<c1-pivot-chart items-source-id="dataSourceEngine"></c1-pivot-chart>
<c1-pivot-grid items-source-id="dataSourceEngine"></c1-pivot-grid>

<button type="button" class="btn btn-default" onclick="saveView()">Save View</button><br />
<button type="button" class="btn btn-default" onclick="loadView()">Load View</button><br />
@section Scripts{
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script type="text/javascript">
        function saveView() {
            var ng = c1.getService('indexEngine');
            if (ng && ng.isViewDefined) {
                localStorage.viewDefinition = ng.viewDefinition;
            }
        }
        function loadView() {
            var ng = c1.getService('indexEngine');
            if (ng && localStorage.viewDefinition) {
                ng.viewDefinition = localStorage.viewDefinition;
                var cmbRowTotals = wijmo.Control.getControl('#RowTotals');
                if (cmbRowTotals) {
                    cmbRowTotals.selectedValue = ng.showRowTotals;
                }
                var cmbColTotals = wijmo.Control.getControl('#ColTotals');
                if (cmbColTotals) {
                    cmbColTotals.selectedValue = ng.showColumnTotals;
                }
                var chkShowZeros = document.getElementById('ColTotals');
                if (chkShowZeros) {
                    chkShowZeros.checked = ng.showZeros;
                }
            }
        }
</script>
}