PDA

View Full Version : Grid inside GridPanel not being layed out.



Animal
15 Nov 2006, 8:50 AM
I create a grid, in a container specified like this:



container: dh.append(document.body,
{
tag:"div",
cls:"ylayout-inactive-content",
id:YAHOO.util.Dom.generateId(null, this.id + "Grid")
}, true),


Then, in the pageLoad handler which I have firing when the first page is loaded (sets up the header ContextMenu etc), I put it into the "north" region:



this.listPanel = new YAHOO.ext.GridPanel(this.grid.grid,
{
title:"The List",
fitToFrame:true,
closable:true
});

// Remove placeholder ContentPanel if we came from a "no-grid" start...
// The north region is unusable if it is first displayed with nothing in it...
// you can never expand it!
if (this.placeholderContentPanel)
{
this.listRegion.remove(this.placeholderContentPanel);
this.listRegion.updateTitle("List");
}
this.listRegion.add(this.listPanel);


When I now look at the DOM inspector, that grid's container has a style width:0px.

When I click the north's temporary view bar and get a sliding view, it is blank - width zero.

When I properly expand the north region using the expand button, I can see it being layed out correctly.

Help! Why is this happening?

jack.slocum
15 Nov 2006, 9:02 AM
You didn't put a size on your container element or am I missing something?

Animal
15 Nov 2006, 9:16 AM
Oops!

Now I have:



container: dh.append(document.body,
{
tag:"div",
cls:"ylayout-inactive-content",
style:{width:this.listRegion.getEl().getBox(true).width + "px"},
id:YAHOO.util.Dom.generateId(null, this.id + "Grid")
}, true),


And when I drop my sliding view down, all I see is the header!

Animal
15 Nov 2006, 9:39 AM
OK, so I need to set a height.

It's funny that I don't need to if I render the grid into active content.

Or if I expand the region.

It's just when it's collapsed and I display the sliding temporary view.

So now I have



var b = this.listRegion.getEl().getBox(true);
var tbHeight = 25;
this.grid = new YAHOO.ext.grid.AspicioGrid(
{
parameterString: parameterString,
listProviderClass:this.listProviderClass,
checkboxes: this.checkboxes,
container: dh.append(document.body,
{
tag:"div",
cls:"ylayout-inactive-content",
style:{width:b.width + "px", height:(b.height - tbHeight) + "px"},
id:YAHOO.util.Dom.generateId(null, this.id + "Grid")
}, true),
onrender: this.onGridRender.createDelegate(this)
});


But it's sliding down and displayed with no scroll bars even though there are 40 lines with only 6 in view. There's space reserved in the given width for scrollbars, but they're not there!