PDA

View Full Version : Can a NestedLayoutPanel accept a toolbar?



manxomfoe
31 Oct 2006, 4:46 PM
I was trying to add a toolbar to a NestedLayoutPanel, and figuring it was a child of ContentPanel, that it might have been possible.

However, this seems to do nothing:

runInstance = new YAHOO.ext.NestedLayoutPanel(innerLayout, {title:'Start Page', toolbar:tb});

Here's a more detailed version of my script:


// the inner layout houses the Controls toolbar, the Graph and the Summary grid
var innerLayout = new YAHOO.ext.BorderLayout('Main', {
north: {
split:true,
initialSize: 350,
minSize: 100,
maxSize: 500,
autoScroll:false,
collapsible:true,
titlebar: true,
animate: true,
cmargins: {top:2,bottom:2,right:0,left:0}
},
center: {
autoScroll:false,
titlebar:true
}
});
innerLayout.beginUpdate();

innerLayout.add('north', new YAHOO.ext.ContentPanel('Graph', {title: "Flow Graph",fitToFrame:true}));
innerLayout.add('center', new YAHOO.ext.ContentPanel('Summary', {title: 'Result Summary',fitToFrame:true}));

// restore innerLayout state
innerLayout.restoreState();
innerLayout.endUpdate(true);

// add the nested layout
var tb = new YAHOO.ext.Toolbar('Main-tb');
tb.addButton({text: 'Next Step',
className: 'nextstep-btn'});
tb.addSeparator();
tb.addButton({text: 'Run to End',
className: 'runtoend-btn'});

runInstance = new YAHOO.ext.NestedLayoutPanel(innerLayout, {title:'Dashboard', toolbar:tb});
layout.add('center', runInstance);

// restore any state information
layout.restoreState();
layout.endUpdate();


Where my HTML looks like this:


<div id="Main" class="ylayout-inactive-content">
<div id="Main-tb" class="ylayout-inactive-content"></div>
<div id="Main-body" class="ylayout-inactive-content">
<div id="Graph" class="ylayout-inactive-content"></div>
<div id="Summary" class="ylayout-inactive-content"></div>
</div>
</div>
Any tips about what I'm missing would be apprciated!

PS - keep up the great work on this toolkit!

jack.slocum
31 Oct 2006, 4:53 PM
This could be doing it:

<div id="Main-tb" class="ylayout-inactive-content"></div>

Try removing that (not needed for toolbar) and see if it works.

manxomfoe
31 Oct 2006, 5:19 PM
Ha ha!!!

That did it. I needed to adjust the constructor of the layout to put a top margin on the north panel so there was enough room for the toolbar, but it was effectve.

The tools show up right where I wanted them, just underneath the tabs.

Thanks Jack!