Column headers not showing up

[devesh]

Hi

Please help me out.  I am showing multiple grids  in single page under different tabs. All grids loads up perfectly fine with data .  But the problem i am facing is the only first grid shows up column header and horizontal scroll rest all grids loads up grid section only .. None of them showing up column header as the class name "pq-header-outer ui-widget-header"  sets up height at run time and is set  to 0 for all grid expect one ...


Please help me out it !!

[paramvir]

You need to listen to activate event of the tabs and refresh the corresponding grid.

http://api.jqueryui.com/tabs/#event-activate

http://paramquery.com/api#method-refresh

[devesh]

Thanks for response !!! But I am not using jquery tabs . I have created custom tabs with sub tabs using css and using jquery.load() populating the required page.  Couple of main tabs have multiple sub tabs in which i am facing the problem . The first sub tab loads perfectly fine with all data as well column headers as well horizontal scroll.  Later none other sub tab is loading neither column header nor bottom horiziontal scroll although grid with data coming up fine.... Hope it makes sense

In simple you can think it as single page with multiple pq grids but shown up div hide show onclick to different tabs ....

Please suggest 

[paramvir]

The basic idea remains same even for custom tabs.

You need to refresh the grid when you unhide/show the corresponding div in order to correct pqgrid's layout.

[devesh]

Actually all grids under sub tabs loads once user clicks on parent tab only clicking on sub tab is just div hide show , all grids under subtab load once click on main tab.  Although as suggested i added the refresh code after pqgrid initializes     as below  but nothing happens. still column header are not populating except the first sub tab ...         
var $grid = $("#grid_json2").pqGrid(obj2);
$( "#grid_json2" ).pqGrid( "refresh" );

Please help me out as it has become road block  for me now ..   

[paramvir]

I didn't say to refresh the grid just after initialization but to refresh the grid when you show the corresponding div container.

Please post your issue on jsfiddle if you are still stuck.

http://jsfiddle.net/LAgZx/64/