1. Report Designer’s Guide
  2. Visualizations
  3. Grid

Grid

To add a grid, set the frame element’s type attribute to grid as shown in the following example.

Example of XML Report Definition to Generate Grid Type JSON Data

<report>
       
       <frame type="grid" name="MainFrame" display-query-name="FrameCondition" display-query-value="0">
           <bands>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left" style="gridheader1" print-width="160">Name</cell>
                    <cell type="text" data-format="text" alignment="right" style="gridheader1" print-width="100">Amount</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">CheckCount</cell>
                    <cell type="expr" data-format="integer" alignment="right">DBGET("TotalsQuery", "numChecks")</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">ChecksDiscounted</cell>
                    <cell type="expr" data-format="integer" alignment="right">
                            IF(ISNULL(DBGET("DiscAvgCheckQuery", "numChecks")),0, DBGET("DiscAvgCheckQuery", "numChecks"))</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">PercentOfTotalCheckCount</cell>
                    <cell type="expr" data-format="percent" alignment="right" decimal-places="1">
                       IF(ISNULL(DBGET("DiscAvgCheckQuery", "numChecks")),0, DBGET("DiscAvgCheckQuery", "numChecks"))/DBGET("TotalsQuery", "numChecks")</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">AverageCheckBeforeDiscount</cell>
                    <cell type="expr" data-format="currency" alignment="right" decimal-places="1">
                            (IF(ISNULL(DBGET("DiscAvgCheckQuery", "salesNet")),0, DBGET("DiscAvgCheckQuery", "salesNet"))
                            - IF(ISNULL(DBGET("DiscAvgCheckQuery", "discountTotal")),0, DBGET("DiscAvgCheckQuery", "discountTotal")))
                            /IF(ISNULL(DBGET("DiscAvgCheckQuery", "numChecks")),1, DBGET("DiscAvgCheckQuery", "numChecks"))</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">AverageDepthOfDiscount</cell>
                    <cell type="expr" data-format="percent" alignment="right" decimal-places="1">
                            (IF(ISNULL(DBGET("DiscAvgCheckQuery", "discountTotal")),0, DBGET("DiscAvgCheckQuery", "discountTotal"))
                            / IF(ISNULL(DBGET("DiscAvgCheckQuery", "numChecks")),1, DBGET("DiscAvgCheckQuery", "numChecks")))
                            / ((IF(ISNULL(DBGET("DiscAvgCheckQuery", "salesNet")),0, DBGET("DiscAvgCheckQuery", "salesNet"))
                            - IF(ISNULL(DBGET("DiscAvgCheckQuery", "discountTotal")),0, DBGET("DiscAvgCheckQuery", "discountTotal")))
                            / IF(ISNULL(DBGET("DiscAvgCheckQuery", "numChecks")),1, DBGET("DiscAvgCheckQuery", "numChecks")))</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left" print-width="80">GrossSales</cell>  
                    <cell type="expr" data-format="currency" alignment="right">
                            DBGET("TotalsQuery", "netSalesTotal") - DBGET("SummedDiscQuery", "discountTotal")</cell>
                </band>
                <band type="stripe">
                    <cell type="text" data-format="text" alignment="left">PercentDiscountOffGrossSales</cell>
                    <cell type="expr" data-format="percent" alignment="right" decimal-places="1">
                            DBGET("SummedDiscQuery", "discountTotal") /(DBGET("TotalsQuery", "netSalesTotal") - DBGET("SummedDiscQuery", "discountTotal"))</cell>
                </band>
            </bands>
        </frame>
        
       <layout type="columner">
            <component frame-name="MainFrame" column="1" visual-type="ojGrid" visual-style="oj-sm-12" visual-title=""/>
        </layout>
       
</report>

Parent topic: Visualizations