[Kimchi-devel] [PATCH] UI: Grid Widget - Enable/Disable Row Selection

[Aline Manera]

Reviewed-by: Aline Manera <alinefm at linux.vnet.ibm.com>

On 03/04/2014 03:03 AM, Hongliang Wang wrote:
> Currently, grid widget will style hovered and selected rows and fire
> a row selected event when user clicks a row. Though it's confused in
> some cases. For example, in software update grid, we only allow user
> to "Update All" software packages: user can't select one package and
> only update it. So nothing will happen if user clicks one row.
>
>      In this patch, we added the feature that allows grid consumer to
> determine disable or enable row selection.
>
> Signed-off-by: Hongliang Wang <hlwang at linux.vnet.ibm.com>
> ---
>   ui/js/src/kimchi.grid.js | 25 ++++++++++++++-----------
>   1 file changed, 14 insertions(+), 11 deletions(-)
>
> diff --git a/ui/js/src/kimchi.grid.js b/ui/js/src/kimchi.grid.js
> index bb98218..20cacc5 100644
> --- a/ui/js/src/kimchi.grid.js
> +++ b/ui/js/src/kimchi.grid.js
> @@ -19,6 +19,7 @@ kimchi.widget.Grid = function(params) {
>       var containerID = params['container'];
>       var container = $('#' + containerID);
>       var gridID = params['id'];
> +    var rowSelection = params['rowSelection'] || 'single';
>       var rowListener = params['onRowSelected'];
>       var htmlStr = [
>         '<div id="', gridID, '" class="grid">',
> @@ -229,19 +230,21 @@ kimchi.widget.Grid = function(params) {
>
>       var selectedIndex = -1;
>       var setBodyListeners = function() {
> -        $('tr', gridBody).on('mouseover', function(event) {
> -            stylingRow(this, 'hover');
> -        });
> +        if(rowSelection != 'disabled') {
> +            $('tr', gridBody).on('mouseover', function(event) {
> +                stylingRow(this, 'hover');
> +            });
>
> -        $('tr', gridBody).on('mouseout', function(event) {
> -            stylingRow(this, 'hover', false);
> -        });
> +            $('tr', gridBody).on('mouseout', function(event) {
> +                stylingRow(this, 'hover', false);
> +            });
>
> -        $('tr', gridBody).on('click', function(event) {
> -            selectedIndex = $(this).index();
> -            stylingRow(this, 'selected');
> -            rowListener && rowListener();
> -        });
> +            $('tr', gridBody).on('click', function(event) {
> +                selectedIndex = $(this).index();
> +                stylingRow(this, 'selected');
> +                rowListener && rowListener();
> +            });
> +        }
>
>           $('.grid-body-view', gridNode).on('scroll', function(event) {
>               $('.grid-header .grid-header-view', gridNode)