kartik-v / yii2-grid

Enhanced GridView with various utilities for Yii Framework 2.0
http://demos.krajee.com/grid
Other
557 stars 302 forks source link

Enhancements to float header, footer, and page summary #1009

Closed kartik-v closed 2 years ago

kartik-v commented 2 years ago

Various new enhancements to add capability to float header, footer, and page summary. This will eliminate dependency on floatThead plugin and simplify. Targeting - New release v3.5.0.

Following new properties will be added:

    /**
     * @var boolean whether the grid will have a floating table header. Note that the table header will stick to the
     * top of the page by default if this is set to `true`. To add an offset - you can configure the CSS style
     * within `headerContainer` - for example:
     *
     * ```
     *    'headerContainer' => ['class' => 'kv-table-header, 'style' => 'top: 50px'] // to set an offset
     * ```
     */
    public $floatHeader = false;

    /**
     * @var boolean whether the grid will have a floating table footer.
     */
    public $floatFooter = false;

    /**
     * @var boolean whether the grid will have a floating page summary. If this is set to `true` it will
     * override one of the following based on `pageSummaryPosition` setting:
     * - the `floatFooter` setting when `pageSummaryPosition` is `GridView::POS_BOTTOM`
     * - the `floatHeader` setting when `pageSummaryPosition` is `GridView::POS_TOP`
     * Note that when position is set to `POS_TOP`, the page summary will stick to the  top of the page by default.
     * To add an offset - you can configure the CSS style within `pageSummaryContainer` - for example:
     *
     * ```
     *    'pageSummaryContainer' => ['style' => 'top: 50px'] // to set an offset
     * ```
     */
    public $floatPageSummary = false;

    /**
     * @var array the HTML options for the table `thead`. The CSS class 'kv-table-header' is added by default and
     * creates the Krajee default header styling for a better float header behavior. In case you are overriding this
     * property at runtime, either use your own CSS class/ style or add the default CSS 'kv-table-header'. Note that
     * with `floatHeader` enabled to `true`, you may need to add an offset for the floated header from top when
     * scrolling (e.g. in cases where you have a fixed bootstrap navbar on top). For example:
     *
     * ```
     *    'headerContainer' => ['class' => 'kv-table-header, 'style' => 'top: 50px'] // to set an offset
     * ```
     */
    public $headerContainer = ['class' => 'kv-table-header'];

    /**
     * @var array the HTML options for the table `tfoot`
     */
    public $footerContainer = ['class' => 'kv-table-footer'];

Following properties will be deprecated and removed in future releases:

   /**
     * @deprecated since release v3.5.0
     * @var boolean whether the table header will float and sticks around as you scroll within a container. If
     * `responsive` is true then this is auto set to `true`.
     */
    public $floatOverflowContainer = false;

    /**
     * @deprecated since release v3.5.0
     * @var array the plugin options for the floatThead plugin that would render the floating/sticky table header
     * behavior. The default offset from the top of the window where the floating header will 'stick' when scrolling
     * down is set to `50` assuming a fixed bootstrap navbar on top. You can set this to `0` or any javascript
     * function / expression.
     * @see http://mkoryak.github.io/floatThead#options
     */
    public $floatHeaderOptions = [];