# GM - FieldSet Pivot

## **Documentation**

**GM - FieldSet Pivot** component is used to display a collection of records as a Pivot Table. With this component, we can display time series records with the ability to summarize and edit the data. 

**Use case:** Display a **Forecast Grid** where the forecast can be set by Opportunity and by Month. See [Pivot Grid Tutorial](/product-tour/pivot-grid-in-action.md)

## **Specification**

<table data-full-width="true"><thead><tr><th width="231">Property</th><th width="114.33333333333331">Type</th><th>Description</th></tr></thead><tbody><tr><td>recordId</td><td>String</td><td>recordId to use. Keep this empty if you want to use the current record.</td></tr><tr><td>Related Object Name *</td><td>String</td><td>The name of the related object to display</td></tr><tr><td>Field Set*</td><td>String</td><td>The Field Set name of the related object to display</td></tr><tr><td>Formula Columns</td><td>String</td><td>Json string to define formula columbs. Use the configurations wizard to produce the property value</td></tr><tr><td>X Columns *</td><td>String</td><td><p>JSON Array of field API Names to build X columns of the Pivot Grid. </p><p></p><p>Don’t forget __c for custom fields.</p></td></tr><tr><td>X Column Sort</td><td>String</td><td><p>The field to sort with to create the pivot header. </p><p></p><p>If this field is empty, X Column field will be used.</p></td></tr><tr><td>X Column Order</td><td>String</td><td><p>The order for X Column Sort (<strong>asc|desc</strong>). </p><p></p><p>Keep it empty for ascending or if X Column Sort is empty</p></td></tr><tr><td>Y Columns *</td><td>String</td><td><p>JSON Array of field API Names to build Y columns of the Pivot Grid. </p><p></p><p>Don’t forget __c for custom fields</p></td></tr><tr><td>Y Hidden Columns</td><td>String</td><td><p>Y Hidden Columns API Name. The records will be grouped by Y Columns, however the hidden columns will not be displayed to the end user.</p><p></p><p>Don’t forget __c for custom fields</p></td></tr><tr><td>Value Columns *</td><td>String</td><td><p>The list of columns to display/edit on the grid as cells. </p><p></p><p>Don’t forget __c for custom fields</p></td></tr><tr><td>Row Limit *</td><td>Integer</td><td>The maximum number of rows to fetch.</td></tr><tr><td>Page Size *</td><td>Integer</td><td>The number of rows to fetch per step. </td></tr><tr><td>Enable Pagination</td><td>Boolean</td><td>Check this option to enable pagination instead of scrolling. Note this option is not compatible with interactive filters.</td></tr><tr><td>Paging Field Name</td><td>String</td><td>Paging field API name. Set this property to handle custom pagination. See <a href="/pages/-MgWMPu0iawpWsnSt4Ey#search-property">Advanced Pagination</a></td></tr><tr><td>Paging Filter</td><td>String</td><td>JSON string to define the paging filter. Set this property to handle custom pagination.</td></tr><tr><td>Paging Sort</td><td>String</td><td>The field list to set the paging sort. Set this property to handle custom pagination.</td></tr><tr><td>Paging Order</td><td>String</td><td>Asc or Desc order for paging sort. Set this property to handle custom pagination.</td></tr><tr><td>Custom Label</td><td>String</td><td>Override the title of the data grid.</td></tr><tr><td>Custom Icon</td><td>String</td><td>Customize the data grid icon. All lightning icons are supported. You can get the icon name from <a href="https://lightningdesignsystem.com/icons/">https://lightningdesignsystem.com/icons<strong>/</strong></a></td></tr><tr><td>Grid Height</td><td>Integer</td><td>Set the grid height. Set this property if you want to control the height and show up components after the grid. The user has to scroll vertically to see more records.</td></tr><tr><td>Filter</td><td>String</td><td>JSON string to define filter criteria. Don’t forget __c for custom fields. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a></td></tr><tr><td>Sort</td><td>String</td><td>The field list to sort the data grid. This field is used only for the initial load.  Don’t forget __c for custom fields. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a></td></tr><tr><td>Order</td><td>String</td><td>Ascending or descending order for sorting. For ascending enter the value asc. For descending enter the value desc</td></tr><tr><td>Aggregate</td><td>String</td><td>JSON string to define the aggregate field. Use __c for custom fields. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a></td></tr><tr><td>Enable Update Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to perform inline editing of the grid.</td></tr><tr><td>Enable Delete Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to delete records. This option will show or hide the 'delete items' icon from the list of quick actions.</td></tr><tr><td>Enable Create Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to create new records. This option will show or hide the 'create records' icon from the list of quick actions. ⚠️When this option is checked, you may need to define the property Default Values to set the required fields for the object.</td></tr><tr><td>Enable Clone Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to clone records. This option will show or hide the 'clone records' icon from the list of quick actions.</td></tr><tr><td>Enable Filter Object</td><td>Boolean</td><td><p>Check this option if you wish to allow the end-user to use filters.</p><p>This option will show or hide the filter combobox.</p></td></tr><tr><td>Enable Freeze Columns</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to freeze columns. This option will show or hide the '<strong>Freeze Columns</strong>' icon from the list of quick actions.</td></tr><tr><td>Enable Export Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to export records. This option will show or hide the '<strong>Export</strong>' icon from the list of quick actions.</td></tr><tr><td>Enable Import Object</td><td>Boolean</td><td>Check this option if you wish to allow the end-user to import CSV files. This option will show or hide the '<strong>Import</strong>' icon from the list of quick actions.</td></tr><tr><td>Enable Grid Collapse</td><td>Boolean</td><td>Check this option if you want to enable grid collapse.</td></tr><tr><td>Enable Toggle Fullscreen</td><td>Boolean</td><td>Check this option if you want to enable toggle fullscreen for the Grid. When this option is active, the end user can open the Grid in fullscreen dialog.</td></tr><tr><td>Enable Auto Fill</td><td>Boolean</td><td>Check this option if you want to enable auto fill. With this option enabled, the user can drag to fill values like Excel.</td></tr><tr><td>Enable Cell Edit</td><td>Boolean</td><td>Check this option if you want to enable cell edit.</td></tr><tr><td>Hide Field Column</td><td>Boolean</td><td>The Pivot Grid is able to display multiple fields. To distinguish the fields we have an extra column containing the field name. Check this field to hide the field name.</td></tr><tr><td>Hide Grand Total</td><td>Boolean</td><td>Check this option if you want to hide the field column.</td></tr><tr><td>Show Header Groups</td><td>Boolean</td><td>Check this option if you want to show header groups.</td></tr><tr><td>Full Record Creation</td><td>Boolean</td><td><p>Check this option if you wish to create a full record instead of using a quick action.</p><p>If this option is activated, the user will be able to create a record using the assigned layout when he clicks on the ‘<strong>Create New Record</strong>’ button.</p></td></tr><tr><td>Default Values</td><td>String</td><td>JSON string to initialize a new object created from the pivot grid. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a></td></tr><tr><td>Hidden Fields</td><td>String</td><td><p>',' separated list of hidden fields for modal creation. When a user creates a new record, hidden fields will be defaulted but not displayed to the end-user (RecordTypeId for instance).</p><p>The configuration wizard can be used to set this property.</p></td></tr><tr><td>Search Fields</td><td>String</td><td>',' separated search fields</td></tr><tr><td>Wildcard Search</td><td>Boolean</td><td>Use Wildcard Search</td></tr><tr><td>Grid Style</td><td>String</td><td><p>JSON string to override the column's style. Don’t forget __c for custom fields. This property can be used to default the width, the text alignment or wrapping for a specific column:</p><p></p><p><strong>To set the style of the header:</strong></p><pre class="language-json"><code class="lang-json">{
    "gm__header": "height:4rem;whiteSpace:normal"
}
</code></pre><p><strong>To set X Column style:</strong></p><pre class="language-json"><code class="lang-json">{
    "gm__xcolumn": "width:150px;cellcontent:wrap"
}
</code></pre><p><strong>To set Field Column style:</strong></p><pre class="language-json"><code class="lang-json">{
    "gm__field": "width:150px;cellcontent:wrap"
}
</code></pre><p><strong>To set Total Column style  :</strong> </p><pre class="language-json"><code class="lang-json">{
    "gm__total": "width:150px;"
}
</code></pre><p><strong>To set any Y Column style:</strong></p><pre class="language-json"><code class="lang-json">{
    "$YColumnName": "width:200px;cellcontent:wrap"
}
</code></pre><p><strong>To set the alignment for any V Column:</strong></p><pre class="language-json"><code class="lang-json">{
    "$VColumnName": "text-align:left"
}
</code></pre></td></tr><tr><td>Frozen Columns</td><td>Integer</td><td># of columns to freeze at startup. Note that the Y Columns and Field Column will be always frozen.</td></tr><tr><td>Total Color</td><td>String</td><td>Total row text color</td></tr><tr><td>Total Background</td><td>String</td><td>Total row background color</td></tr><tr><td>Show Border</td><td>Boolean</td><td>Check this option if you wish to add a border to the grid.</td></tr><tr><td>Show Column Border</td><td>Boolean</td><td>Check this option if you wish to add a border to the grid columns.</td></tr><tr><td>Cell Coloring</td><td>String</td><td><p>JSON conditions for cells coloring. You can define for each field displayed in the grid the coloring and the corresponding condition. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a></p><p></p><p>Both V Columns and Y Columns can be colored. See the example below:</p><pre class="language-json"><code class="lang-json">{
    "gmpkg__Net_Revenue__c": [
        {
            "color": "#A9E494",
            "exp": {
                "gmpkg__Invest__c": {
                    "operator": ">=",
                    "value": "-1000000"
                }
            }
        }
    ],
    "gmpkg__Opportunity__r.StageName": [
        {
            "color": "#f5a442",
            "exp": {
                "gmpkg__Opportunity__r.StageName": {
                    "operator": "=",
                    "value": "Needs Analysis"
                }
            }
        }
    ]
}
</code></pre></td></tr><tr><td>Custom Field Labels</td><td>String</td><td>{"name:label"} custom field labels map.</td></tr><tr><td>Lookup Fields Options</td><td>String</td><td>JSON options for lookup fields for V Columns. Ex. {apiName : {titleField : value, subTitleField : value}}</td></tr><tr><td>ReadOnly Fields</td><td>String</td><td>',' separated list of read-only fields. The user will not be able to edit these fields the same as read-only fields on the page layout. See <a href="/pages/-MEstkhme84gnGFcsCxP#specification">GM - RelatedList Grid</a>.</td></tr><tr><td>Actions</td><td>String</td><td><p>JSON string to initialize the list of available actions on each record.</p><p>Custom actions are available on each tab as toolbar. You can leverage your existing quick actions.</p><p>The configuration wizard can be used to build the list of actions. See Actions Configuration</p></td></tr><tr><td>Custom Visible Actions</td><td>Boolean</td><td>#of visible custom actions.</td></tr><tr><td>Show Actions as Buttons</td><td>Boolean</td><td>Use buttons for actions instead of icons.</td></tr><tr><td>Enable Refresh View</td><td>Boolean</td><td>Check this option if you want to refresh the view after an update.</td></tr><tr><td>Default Mode</td><td>String</td><td><p>String to define the initial display mode of the grid (<strong>edit</strong> | <strong>read</strong>). </p><p></p><p>If this property is set to <strong>edit</strong>, the grid is displayed in edit in the first load of the page.</p></td></tr></tbody></table>

## **API Reference**

{% tabs fullWidth="true" %}
{% tab title="FieldSetPivotGridComponent.design" %}
{% code fullWidth="false" %}

```xml
<design:component label="GM - FieldSet Pivot">
    <design:attribute name="recordId" label="recordId" 
                      description="recordId to use. Keep this empty if you want to use the current record"/>        
    <design:attribute name="relatedObjectName" label="Related Object Name" 
                      description="The name of the related object to display. Ex. Opportunity"/>    
    <design:attribute name="fieldSetName" label="Field Set" 
                      description="FieldSet name or ',' separated list of fields to display"/> 
    <design:attribute name="jsonFormulas" label="Formula Columns" 
                      description="Json string to define formula columbs. Use the configurations wizard to produce the property value"/>     
    <design:attribute name="xJsonColumns" label="X Columns" 
                      description="X Columns API Name. Don’t forget __c for custom fields"/> 
    <design:attribute name="xsort" label="X Column Sort" 
                      description="The field to sort with to create the pivot header. X Column field will be user if empty"/>
    <design:attribute name="xorder" label="X Column Order" 
                      description="The order for X Colmun Sort (asc|desc). Keep it empty for asc or if X Column Sort is empty"/>                                            
    <design:attribute name="yJsonColumns" label="Y Columns" 
                      description="Y Columns API Name. Don’t forget __c for custom fields"/> 
    <design:attribute name="yHiddenColumns" label="Y Hidden Columns" 
                      description="Y Hidden Columns API Name. Don’t forget __c for custom fields"/> 
    <design:attribute name="vJsonColumns" label="Value Columns" 
                      description="list of columns to display/edit on the grid. Don’t forget __c for custom fields"/>                                                               
    <design:attribute name="rowLimit" label="Row Limit" 
                      description="The maximum number of row to fetch"/>  
    <design:attribute name="pageSize" label="PageSize" 
                      description="The number of row to fetch per step"/>
    <design:attribute name="paginationEnabled" label="Enable Pagination" 
                      description="Check this option to enable pagination instead of scrolling. Note this option is not compatible with interactive filters"/>                          
    <design:attribute name="pagingFieldName" label="Paging Field Name" 
                      description="Paging field api name. Set this property to handle a custom pagination"/>
    <design:attribute name="pagingFilter" label="Paging Filter" 
                      description="Json string to define the paging filter. Set this property to handle a custom pagination"/>
    <design:attribute name="pagingSort" label="Paging Sort" 
                      description="The field list to set the paging sort. Set this property to handle a custom pagination"/>
    <design:attribute name="pagingOrder" label="Paging Order" 
                      description="Asc or Desc order for paging sort. Set this property to handle a custom pagination"/>
    <design:attribute name="customLabel" label="Custom Label" 
                      description="Override the label of data grid"/> 
    <design:attribute name="customIcon" label="Custom Icon" 
                      description="Customize the data grid icon. All lightning icons are supported. You can get the icon name from https://lightningdesignsystem.com/icons/"/> 
    <design:attribute name="height" label="Grid Height" 
                      description="Set the grid height"/>  
    <design:attribute name="filter" label="Filter" 
                      description="Json string to define filter criteria. Don’t forget __c for custom fields. Ex. {'StageName':'Needs Analysis'} to see only 'Needs Analysis' Opportunities"/>    
    <design:attribute name="sort" label="Sort" 
                      description="The field list to sort the data grid. This field is used only for the initial load. Don’t forget __c for custom fields. Ex. Amount to sort opportunities by amount"/>
    <design:attribute name="order" label="Order" 
                      description="Asc or Desc order for sorting"/>    
    <design:attribute name="aggregate" label="Aggregate" 
                      description="Json string to defined the aggregate fields. The components are supporting 'sum', 'minx' and 'max'. Don’t forget __c for custom fields. Ex. {'Amount':'sum'} to aggregate the amount of opportunities"/>    
    <design:attribute name="canUpdate" label="Enable Update Object" 
                      description="Check this option if you want to update object"/>    
    <design:attribute name="canDelete" label="Enable Delete Object" 
                      description="Check this option if you want to delete object"/>    
    <design:attribute name="canCreate" label="Enable Create Object" 
                      description="Check this option if you want to create object"/>    
    <design:attribute name="canClone" label="Enable Clone Object" 
                      description="Check this option if you want to clone objects"/>                      
    <design:attribute name="canFilter" label="Enable Filter Object" 
                      description="Check this option if you want to use filters"/>    
    <design:attribute name="canFreeze" label="Enable Freeze Columns" 
                      description="Check this option if you want to freeze columns"/>    
    <design:attribute name="canExport" label="Enable Export Object" 
                      description="Check this option if you want to export objects"/> 
    <design:attribute name="canImport" label="Enable Import Object" 
                      description="Check this option if you want to import CSV files"/>                             
    <design:attribute name="canCollapse" label="Enable Grid Collapse" 
                      description="Check this option if you want to enable Grid collapse"/>        
    <design:attribute name="canToggleFullscreen" label="Enable Toggle Fullscreen" 
                      description="Check this option if you want to enable toggle fullscreen"/>                      
    <design:attribute name="canDragToFill" label="Enable Auto Fill" 
                      description="Check this option if you want to enable auto fill"/>    
    <design:attribute name="canInlineEditCell" label="Enable Cell Edit" 
                      description="Check this option if you want to enable cell edit"/>                              
    <design:attribute name="noFieldColumn" label="Hide Field Column" 
                      description="Check this option if you want to hide field column"/>  
    <design:attribute name="noGrandTotal" label="Hide Grand Total" 
                      description="Check this option if you want to hide grand total"/>   
    <design:attribute name="showHeaderGroups" label="Show Header Groups" 
                      description="Check this option if you want to show header groups"/>                                                                                                                                                                          
    <design:attribute name="fullRecordCreation" label="Full Record Creation" 
                      description="Check this option if you want to create a full record"/>                                    
    <design:attribute name="defaultValues" label="Default Values" 
                      description="Json string to initialize a new object created from the data grid. Don’t forget __c for custom fields. Ex. {'accountid':'$recordId', 'name':'Opp 1', 'stagename':'Needs Analysis'}"/>
    <design:attribute name="hiddenFields" label="Hidden Fields"                       
                      description="',' separated list of hidden fields for modal creation"/>   
    <design:attribute name="jsonSearchFields" label="Search Fields" 
                      description="',' separated search fields"/>   
    <design:attribute name="wildCardSearch" label="Wildcard Search" 
                      description="Use Wildcard Search"/>
    <design:attribute name="style" label="Grid Style" 
                      description="Set the pivot grid style(header width, xcolumn width, total width...)"/>    
    <design:attribute name="frozenColumns" label="Frozen Columns" 
                      description="# of columns to freeze"/>                            
    <design:attribute name="TotalColor" label="Total Color" 
                      description="Total row color"/>  
    <design:attribute name="TotalBgColor" label="Total Background" 
                      description="Total row background color"/> 
    <design:attribute name="showBorder" label="Show Border" 
                      description="Show Border"/>
    <design:attribute name="showColumnBorder" label="Show Column Border" 
                      description="Show Column Border"/>          
    <design:attribute name="coloring" label="Cell Coloring" 
                      description="JSON conditions for cells coloring"/>
    <design:attribute name="fieldLabels" label="Custom Field Labels" 
                      description="{name:label} custom field labels map"/>                                                
    <design:attribute name="readOnlyFields" label="ReadOnly Fields" 
                      description="',' separated list of readonly fields"/>    
    <design:attribute name="lookupOptions" label="Lookup Fields Options" 
                      description="JSON options for lookup fields for V Columns. Ex. {apiName : {titleField : value, subTitleField : value}}"/>                                                     
    <design:attribute name="jsonActions" label="Actions" 
                      description="Json string to initialize the list of available custom actions"/>
    <design:attribute name="visibleActions" label="Custom Visible Actions" 
                      description="# of visible custom actions"/>                      
    <design:attribute name="buttonActions" label="Show Actions as Buttons" 
                      description="Use buttons for actions instead of icons"/>    
    <design:attribute name="enableRefreshView" label="Enable Refresh View" 
                      description="Check this option if you want to refresh the view after an update"/>
    <design:attribute name="displayMode" label="Default Mode" 
                      description="Default execution mode : read | edit"/>                                           
</design:component>
```

{% endcode %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.gridmate.io/package-reference/components-library/gm-fieldset-pivot.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.