Frozen Header

22 May 20172 minutes to read

Allows you to freeze the header of the Grid so that it will be always visible when scrolling the content with a large number of rows or columns providing a precise view.

  • html
  • <div id="PivotGrid1"></div>
    
    <script type="text/babel">
        //...
        var frozenHeaderSettings= {enableFrozenHeaders : true}  //To Freeze the both Row and Column headers
        $(function(){
            ReactDOM.render(
            <EJ.PivotGrid id="PivotGrid" frozenHeaderSettings={frozenHeaderSettings}></EJ.PivotGrid>,
            document.getElementById('PivotGrid1')
            );
        });
    </script>

    We can also freeze the row/column headers individually by setting the below properties.

  • html
  • <script type="text/babel">
        //...
        var frozenHeaderSettings= {enableFrozenRowHeaders : true}  //To Freeze the Row headers only
        $(function(){
            ReactDOM.render(
            <EJ.PivotGrid id="PivotGrid" frozenHeaderSettings={frozenHeaderSettings}></EJ.PivotGrid>,
            document.getElementById('PivotGrid1')
            );
        });
    </script>

  • html
  • <script type="text/babel">
        //...
        var frozenHeaderSettings= {enableFrozenColumnHeaders : true}  //To Freeze the Column headers only
        $(function(){
            ReactDOM.render(
            <EJ.PivotGrid id="PivotGrid" frozenHeaderSettings={frozenHeaderSettings}></EJ.PivotGrid>,
            document.getElementById('PivotGrid1')
            );
        });
    </script>