Yii 2.0: yii2-grid

GridView enhancements and utilities for Yii Framework 2.0.
36 followers

Yii2 GridView on steroids. Various modifications and enhancements to one of the most used widgets by Yii developers. The widget contains new additional Grid Columns with enhanced settings for Yii Framework 2.0. The widget also incorporates various Bootstrap 3.x styling options. Refer detailed documentation and/or a complete demo.

Latest Release

The latest version of the module is v1.8.0 released on 01-Aug-2014. Refer updated documentation and updated demo.

Change Log

Refer the CHANGE LOG for details.

GridView

\kartik\grid\GridView

The following functionalities have been added/enhanced:

Table Styling (Enhanced)

Control various options to style your grid table.

Custom Header & Footer (New)

Add custom header or footer rows, above / below your default grid header and footer.

Floating Header (New)

Allows the grid table to have a floating table header. Uses the JQuery Float THead plugin to display a seamless floating table header.

Panel (New)

Allows configuration of GridView to be enclosed in a panel that can be styled as per Bootstrap 3.x. The panel will enable configuration of various sections to embed content/buttons, before and after header, and before and after footer.

Page Summary (New)

This is a new feature added to the GridView widget. The page summary is an additional row above the footer - for displaying the summary/totals for the current GridView page. The following parameters are applicable to control this behavior:

  • showPageSummary: boolean whether to display the page summary row for the grid view. Defaults to false.
  • pageSummaryRowOptions: array, HTML attributes for the page summary row. Defaults to ['class' => 'kv-page-summary warning'].

Grid Export (New)

This is a new feature added to the GridView widget. It allows you to export the displayed grid content as HTML, CSV, TEXT, or EXCEL. It uses the rendered grid data on client to convert to one of the format specified using JQuery. This is supported across all browsers. The following are new features added since release v1.6.0:

  • Ability to preprocess and convert column data to your desired value before exporting. There is a new property exportConversions that can be setup in GridView. For example, this currently is set as a default to convert the HTML formatted icons for BooleanColumn to user friendly text like Active or Inactive after export.
  • Hide any row or column in the grid by adding one or more of the following CSS classes:
    • skip-export: Will skip this element during export for all formats (html, csv, txt, xls).
    • skip-export-html: Will skip this element during export only for html export format.
    • skip-export-csv: Will skip this element during export only for csv export format.
    • skip-export-txt: Will skip this element during export only for txt export format.
    • skip-export-xls: Will skip this element during export only for xls (excel) export format. These CSS can be set virtually anywhere. For example headerOptions, contentOptions, beforeHeader etc.

Data Column (Enhanced)

\kartik\grid\DataColumn

The default Yii data column has been enhanced with various additional parameters. Refer documentation for details.

Editable Column (Enhanced)

\kartik\grid\EditableColumn

An enhanced data column that allows you to edit the cell content using kartik\editable\Editable widget. Refer documentation for details.

Formula Column (New)

\kartik\grid\FormulaColumn

This is a new grid column class that extends the \kartik\grid\DataColumn class. It allows calculating formulae just like in spreadsheets - based on values of other columns in the grid. The formula calculation is done at grid rendering runtime and does not need to query the database. Hence you can use formula columns within another formula column. Refer documentation for details.

Boolean Column (New)

\kartik\grid\BooleanColumn

This is a new grid column class that extends the \kartik\grid\DataColumn class. It automatically converts boolean data (true/false) values to user friendly indicators or labels (that are configurable). Refer documentation for details. The following are new features added since release v1.6.0:

  • BooleanColumn icons have been setup as ICON_ACTIVE and ICON_INACTIVE constants in GridView.

Action Column (Enhanced)

\kartik\grid\ActionColumn

Enhancements of \yii\grid\ActionColumn to include optional dropdown Action menu and work with the new pageSummary and a default styling to work for many scenarios. Refer documentation for details. The following are new features added since release v1.6.0: - ActionColumn content by default has been disabled to appear in export output. The skip-export CSS class has been set as default in headerOptions and contentOptions.

Serial Column (Enhanced)

\kartik\grid\SerialColumn

Enhancement of \yii\grid\SerialColumn to work with the new pageSummary and a default styling to work for many scenarios. Refer documentation for details.

Checkbox Column (Enhanced)

\kartik\grid\CheckboxColumn

Enhancements of \yii\grid\CheckboxColumn to work with the new pageSummary and a default styling to work for many scenarios. Refer documentation for details.

Requirements

  • Yii 2.0 (dev-master)
  • PHP 5.4
  • Twitter Bootstrap 3.0

Note: This extension mandatorily requires Yii Framework 2. The framework is under active development and the first stable release of Yii 2 is expected in early 2014.

Installation

The preferred way to install this extension is through composer.

Either run:

$ php composer.phar require kartik-v/yii2-grid "dev-master"

or add:

"kartik-v/yii2-grid": "dev-master"

to the require section of your composer.json file.

Demo

You can see detailed documentation and demonstration on usage of the extension.

Report

License

yii2-grid is released under the BSD 3-Clause License. See the bundled LICENSE.md for details.

Resources

Total 11 comments

#18350 report it
Scott_Huang at 2014/10/19 09:48am
Thanks.

Thanks.

#17985 report it
Kartik V at 2014/08/21 05:49pm
Pjax Upgrades with v1.9.0

Extension upgraded to v1.9.0 with various inbuilt Pjax enhancements.

#17858 report it
Kartik V at 2014/07/31 03:02pm
Editable Column

Editable Column has been added with new release v1.8.0. Refer documentation and demo for details.

#17698 report it
Kartik V at 2014/07/15 09:58am
Feedback and Pull Request

@sltech thanks for the feedback and glad you find the extension useful. You may also raise a new issue or submit a new pull request on github here for any proposed enhancements.

#17688 report it
Kartik V at 2014/07/14 11:17pm
Grid Layout Positioning

@sltech you may want to read the grid layout templates documentation. You can add the special tags {export} and {toolbar} to the layout to render the export dropdown button and the toolbar setting buttons.

Requirement # 1: Set panel to false, and set the layout property in the grid. You can check it in the demo as well. Without panel, you can set it to something as:

echo GridView::widget([
    'layout' => '<div class="pull-right">{export}</div>\n{summary}\n{items}\n{pager}',
    'panel' => false
]);

Requirement # 2: Exporting on screen data is the only option built in by default (because that's the more difficult part of reading the display from the client and passing it to the server for download). For exporting the full data, you can directly read the data from your dataProvider and can write a simple PHP function to do this for you. Since, this may vary by each individual's choice, as to what data, what format etc, this was not built into the grid (its basically a separate extension of the built in Yii DataProvider - to yield out formats for CSV, TEXT, XLS, etc.). If you feel, you may create a Pull Request to enhance this if you can generalize. Note that, the formatting and formulae need to be parsed by you for this case.

#17686 report it
sltech at 2014/07/14 04:21pm
Export button position and data export

Hi Kartik,

Thank you for such a wonderful work. I have become fan of this plugin after 2 days of use.

I have 2 questions related to positioning of the Export button & export data.

  1. I need to show grid in a tab and that is being done using partialRender. Now I dont want to show the grid panel but do want to show the export button & at the same location. If the template is changed it will be changed for all other grids in the application. how this can be done, because when i hide/comment the panel it doesn't show the export button.
  2. how can i give option to export on screen data & full data ?

Thanks

#16980 report it
Kartik V at 2014/04/18 01:50am
Enhancements version 1.3

The module has been upgraded to v1.3 (refer change log).

With translations contributed by couple of folks, have included a LANGUAGE selector to the grid demo. So you can check the translations as well.

#16787 report it
Kartik V at 2014/03/27 09:50am
Upgraded to ver 1.2.0

FYI... the yii2-grid extension has been enhanced:

  1. to work with all browsers in a more secure and reliable manner
  2. to support export of the displayed grid and download as HTML, TEXT, CSV, and EXCEL formats
  3. configurable file names for export
  4. configurable worksheet name for excel
  5. configurable column and row delimiters for export as TEXT or CSV
  6. i18n/translation enabled
  7. and the extension is a module now which has potential to add on more features later.

and more other features... Refer the updated documentation and demo.

#16772 report it
Kartik V at 2014/03/26 04:47pm
Grid Export Added and Templates Enhanced

The \kartik\grid\GridView extension is now updated to include the export feature for HTML and CSV formats (and EXCEL is in process) via a newly developed JQuery plugin. It allows you to export the grid data displayed on screen. You can refer the demo and documentation for the new features. The export plugin has some intelligence to detect the HTML5 download attribute for the supported modern browsers. Check the Export Data Button in the demo. The EXCEL export is being worked upon.

#16705 report it
Kartik V at 2014/03/21 10:11am
Demo Page Online

FYI - the demo page is online for this extension. The demo doubles up as a GridView configurator as well. You can configure various widget options dynamically and see the impact.

#16699 report it
Kartik V at 2014/03/20 04:07pm
Demo page will be updated soon

Demo page is in process and will be updated soon

Leave a comment

Please to leave your comment.

Create extension
Downloads
No downloadable files yet