Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
75
Grid summary error only with sum
posted

I have the following error when trying to leave only the sum in a column, I want to do it with angularjs > http://jsfiddle.net/m5aptx23/1/ , I attach the case in JSFiddle and the screen capture:

The code:

<script src="https://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>

<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.core.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/infragistics.lob.js"></script>

<script src="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/js/extensions/igniteui-angular.js"></script>

<script src="https://igniteui.github.io/help-samples/data-files/northwindProducts.js"></script>

<script id="colTmpl" type="text/template" ng-non-bindable="">

        {{if ${UnitsInStock} == null }}

        N/A

        {{elseif ${UnitsInStock} >= (Math.random()+0.5)*${UnitsInStock} }}

        $ ${UnitsInStock}

        <img width='10' height='15' src='igniteui.github.io/.../arrowUp.gif' />

        {{else}}

        $ ${UnitsInStock}

        <img width='10' height='15' src='igniteui.github.io/.../arrowDown.gif' />

        {{/if}}

    </script>

<link href="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet">

<link href="https://secure-cdn-na.infragistics.com/igniteui/2017.1/latest/css/structure/infragistics.css" rel="stylesheet">

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

 

<div ng-app="sampleApp" ng-controller="gridController">

<div class="row">

<div class="col-md-8">

<ig-grid id="grid1" data-source="data" data-source-type="json" width="100%" height="400px" auto-commit="true" auto-generate-columns="false">

<columns>

<column key="ProductName" header-text="Product Name" width="250px" data-type="string"></column>

<column key="ProductID" header-text="ID" width="200px" data-type="number"></column>

</columns>

<features>

<feature name="Summaries">

<column-settings>

<column-setting column-key="ProductName" allow-summaries="false"></column-setting>

<column-setting column-key="ProductID" allow-summaries="true">

<summary-operands row-display-label="Total" type="sum" active="true"></summary-operands>

</column-setting>

</column-settings>

</feature>

</features>

</ig-grid>

</div>

</div>

</div>

  • 17070
    Offline posted

    Hello Rezo,

    When summary operands are defined each of them should be in separate <summary-operand> tag. For example:

     <feature name="Summaries">
          <column-settings>
           <column-setting column-key="ProductName" allow-summaries="false"></column-setting>
           <column-setting column-key="ProductID" allow-summaries="true">
            <summary-operands>
                      <summary-operand row-display-label="Total" type="SUM" active="true"></summary-operand>
                    </summary-operands>    
           </column-setting>
          </column-settings>
         </feature>

    Your modified sample is available here: http://jsfiddle.net/m5aptx23/2/

    Please let me know if you need any further assistance.

    Regards,
    Vasya Kacheshmarova
    Associate Software Developer
    Infragistics