Fix #25: Row highlight option for checkbox column

CHANGE.md

@@ -1,15 +1,17 @@
-version 1.0.0
+version 1.4.0
 =============
-Initial release
+(enh #25): Allow highlighting of selected row for a CheckboxColumn
 
-version 1.1.0
+- Added `rowHighlight` property to set if a row needs to be highlighted
+- Added `rowSelectedClass` property to configure the CSS class for the highlighted row.
+
+version 1.3.0
 =============
+(enh #19): Gridview enhancements (export, toolbar, iframe)
 
-1. Export features added through a brand new custom JQuery plugin:
-  - Save displayed grid as HTML
-  - Save displayed grid as CSV
-2. Templates to modify positioning of the export menu and the panel before and after contents
-3. Ability to display toolbar in the header.
+- Enable rendering of export without panel by passing `{export}` variable to grid `layout` property.
+- Enable rendering of toolbar without panel by passing `{toolbar}` variable to grid `layout` property.
+- Revamp export form to be submitted in a new window (in a non-intrusive manner)
 
 version 1.2.0
 =============
@@ -20,10 +22,15 @@ version 1.2.0
   - Save displayed grid as TEXT
   - Save displayed grid as XLS
 
-version 1.3.0
+version 1.1.0
 =============
-(enh #19): Gridview enhancements (export, toolbar, iframe)
 
-- Enable rendering of export without panel by passing `{export}` variable to grid `layout` property.
-- Enable rendering of toolbar without panel by passing `{toolbar}` variable to grid `layout` property.
-- Revamp export form to be submitted in a new window (in a non-intrusive manner)
+1. Export features added through a brand new custom JQuery plugin:
+  - Save displayed grid as HTML
+  - Save displayed grid as CSV
+2. Templates to modify positioning of the export menu and the panel before and after contents
+3. Ability to display toolbar in the header.
+
+version 1.0.0
+=============
+Initial release

assets/js/kv-grid.js

@@ -0,0 +1,25 @@
+/*!
+ * @copyright Copyright © Kartik Visweswaran, Krajee.com, 2013
+ * @version 1.0.0
+ *
+ * Client actions for yii2-grid 
+ * 
+ * Author: Kartik Visweswaran
+ * Copyright: 2013, Kartik Visweswaran, Krajee.com
+ * For more JQuery plugins visit http://plugins.krajee.com
+ * For more Yii related demos visit http://demos.krajee.com
+ */
+
+function selectRow($grid, css) {
+    $grid.find(".kv-row-select input").on('change', function () {
+        $(this).parents("tr:first").toggleClass(css);
+    });
+    $grid.find(".kv-all-select input").on('change', function () {
+        if ($(this).is(':checked')) {
+            $grid.find(".kv-row-select").parents("tr").addClass(css);
+        }
+        else {
+            $grid.find(".kv-row-select").parents("tr").removeClass(css);
+        }
+    });
+}

assets/js/kv-grid.min.js

@@ -0,0 +1,11 @@
+/*!
+ * @copyright Copyright © Kartik Visweswaran, Krajee.com, 2013
+ * @version 1.0.0
+ *
+ * Tabular form script
+ * 
+ * Author: Kartik Visweswaran
+ * Copyright: 2013, Kartik Visweswaran, Krajee.com
+ * For more JQuery plugins visit http://plugins.krajee.com
+ * For more Yii related demos visit http://demos.krajee.com
+ */function selectRow(e,t){e.find(".kv-row-select input").on("change",function(){$(this).parents("tr:first").toggleClass(t)});e.find(".kv-all-select input").on("change",function(){if($(this).is(":checked")){e.find(".kv-row-select").parents("tr").addClass(t)}else{e.find(".kv-row-select").parents("tr").removeClass(t)}})}

grid/CheckboxColumn.php

@@ -49,6 +49,17 @@ class CheckboxColumn extends \yii\grid\CheckboxColumn
      */
     public $width = '50px';
 
+    /**
+     * @var boolean highlight current row if checkbox is checked
+     */
+    public $rowHighlight = true;
+
+    /**
+     * @var string highlight CSS class to be applied for highlighting the row.
+     * Defaults to 'info'.
+     */
+    public $rowSelectedClass = GridView::TYPE_INFO;
+
     /**
      * @var boolean|string whether the page summary is displayed above the footer for this column.
      * If this is set to a string, it will be displayed as is. If it is set to `false` the summary
@@ -78,6 +89,12 @@ class CheckboxColumn extends \yii\grid\CheckboxColumn
     public function init()
     {
         $this->grid->formatColumn($this->hAlign, $this->vAlign, $this->noWrap, $this->width, $this->headerOptions, $this->contentOptions, $this->pageSummaryOptions, $this->footerOptions);
+        if ($this->rowHighlight) {
+            Html::addCssClass($this->contentOptions, 'kv-row-select');
+            Html::addCssClass($this->headerOptions, 'kv-all-select');
+            $view = $this->grid->getView();
+            $view->registerJs('selectRow($("#' . $this->grid->options['id'] . '"), "' . $this->rowSelectedClass . '");');
+        }
         parent::init();
     }
 

grid/GridViewAsset.php

@@ -22,6 +22,7 @@ class GridViewAsset extends AssetBundle
 	public function init()
 	{
 		$this->setSourcePath(__DIR__ . '/../assets');
+		$this->setupAssets('js', ['js/kv-grid']);
 		$this->setupAssets('css', ['css/kv-grid']);
 		parent::init();
 	}