Forum
Log In
Home
Topic RSS
16:21
01/04/2011
Offline
I've tried to do a search for similar topics, but I didn't come up with anything (most of the results were about hiding/showing columns)
I'm trying to embed multiple jqGrids in jquery-ui tab structure, the problem being that the width:'auto' setting seems to fail for those that are in the hidden tabs - so when I move to a tab that's initially not selected with a rendered jqGrid within it the grid is tiny.
I believe this is because jquery apparently cannot get the width of a containing element when it's hidden (I know it has trouble getting the position/etc.).
Has anybody had experience rendering a jqGrid that is within an initially hidden element? Outside of deferring the jqGrid initialization until after the tab is clicked, is there a way to get this to work correctly?
Alternatively I could try and auto-width it myself by crawling up the parent() tree until I find a is(":visible") element and calculating what the container size WILL be, but that seems like a bit of a hack.
17:05
04/06/2010
Offline
An alternative is to load the grid only when the tab is clicked i.e.
$(document).ready(function(){
$('#tabs').tabs({
"select":function(event,ui){
switch(ui.index){
case 0:
loadGrid();
break;
........
}
}
});
});
.
var grid_isloaded=false;
function loadGrid(){
if(!grid_isloaded){
$('#...').jqGrid({.....});
grid_isloaded=true;
}else
$('#...).trigger("reloadGrid");
};
This is what I do and has the advantage that it is not getting the data until the tab is clicked, improving page load time.
Dave
17:19
01/04/2011
Offline
Yeah that's basically what I did ... within my jqGrid wrapper class:
var created = false;
var create = function() {
if (created === true)
return;
created = true;
$('#mygrid').jqGrid(cfg);
};
if (!$('#mygrid').is(':hidden')) {
// good to go.
create();
}
else {
var tabHandler = function(event, ui) {
if (!$('#mygrid').is(':hidden')) {
// good to go.
create();
$('#tabs').unbind("tabsshow", tabHandler);
}
};
$('#tabs').bind("tabsshow", tabHandler);
}
(the above assumes '#tabs' is the tab block and the '#mygrid' is where the grid will be rendered)
Most Users Ever Online: 715
Currently Online:
49 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66
