ParamQuery grid support forum

General Category => Help for ParamQuery Grid (free version) => Topic started by: singhra2 on May 19, 2014, 11:06:36 am

Title: Editable Grid within accordion
Post by: singhra2 on May 19, 2014, 11:06:36 am

An editable grid (when refreshed) within jquery accordion/tab control does not render properly with the scrollbars.

The link to the jsfiddle is http://jsfiddle.net/LAgZx/321/

everytime the grid is refreshed, it seems to loose its height property I believe.

Title: Re: Editable Grid within accordion
Post by: paramvir on May 19, 2014, 11:51:19 am

The deactivated panels of the accordion have display: none which cause problem in initial rendering of the pqGrid.

There are 2 ways to solve this:

1) Create accordion after creation of pqGrids.

http://jsfiddle.net/LAgZx/328/

or

2) use activate event of accordion to refresh the corresponding grid in the activated panel as in code below:

Code: [Select]

                                        activate:function( event, ui ) {                                           
                                            var $grid=ui.newPanel.find(".pq-grid");
                                            if($grid.data('pqrefresh')==null){
                                                $grid.pqGrid('refresh').pqGrid('refresh');
                                                $grid.data('pqrefresh', true);
                                            } 
                                         }

http://jsfiddle.net/LAgZx/327/

Title: Re: Editable Grid within accordion
Post by: singhra2 on May 22, 2014, 12:32:45 pm

Works brilliantly well!!  ;)