PDA

View Full Version : What's wrong with this layout?



donalconlon
26 Nov 2006, 2:47 PM
i'm trying the sample nested layout in the documentation. However, I"m trying to put the nest in the navigation pane (west). It displays ok, but if i stretch the vertical splitter, or I collapse the south nested panel, it get's all screwed up.

What am I doing wrong?

------------------------------------------------------------------------
<div>
<div>
Header
</div>
<div>
Content
</div>
<div>
Navigation.
</div>
<div>
List
</div>
<div>
Summary info
</div>
</div>
------------------------------------------------------------------------

Example = function(){
return {
init : function(){
var layout = new YAHOO.ext.BorderLayout(document.body, {
north: {
split:false,
initialSize: 93
},
west: {
split:true,
initialSize: 200,
titlebar: true,
collapsible: true,
animate: true
},
center: {
autoScroll: true
}
});
layout.beginUpdate();
layout.add('north', new YAHOO.ext.ContentPanel('header', {fitToFrame:true}));
layout.add('center', new YAHOO.ext.ContentPanel('content', {fitToFrame:true}));

var innerLayout = new YAHOO.ext.BorderLayout('content', {
south: {
split:true,
autoScroll:false,
collapsible:true,
titlebar: true
},
center: {
autoScroll:true
}
});

innerLayout.add('south', new YAHOO.ext.ContentPanel('inner1', {title:"Summary",fitToFrame:true}));
innerLayout.add('center', new YAHOO.ext.ContentPanel('inner2',{fitToFrame:true}));

layout.add('west', new YAHOO.ext.NestedLayoutPanel(innerLayout,"List"));

layout.endUpdate();
}
}

}();
YAHOO.ext.EventManager.onDocumentReady(Example.init, Example, true);

jack.slocum
26 Nov 2006, 3:22 PM
Can you give any more of a description and wrap your code in a code block so I can read it. :D

donalconlon
26 Nov 2006, 3:33 PM
Sorry Jack, new to posting (but not to asking questions!).

What I'm trying to achieve is Banner on top, navigation on left, and content on right. The navigation is to have a nested layout, with north and south collapsable.
I took your nested sample, and tried to flip it.
It looks ok when it loads, but when I move either verical or horizontal splitter, it gets messed up. As in length of south title either expands or contracts. If I collpase the south panel, it collapses all the way so I can't expand it again.

Thanks for quick reply!!!
(like new site style too 8) )



<html>
<head>
<title>MiCasa Projects</title>

<script></script>
<script></script>

<link>
<link>
<link>

<script></script>

<style>
body {font:normal 9pt verdana; margin:0;padding:0;border:0px none;overflow:hidden;}
#header{
background: url('images/bg-head.gif') repeat-x top;
padding:15px 10px;
}

#content p {
margin:5px;
}

.ylayout-panel{
border:0px none;
}
</style>
</head>

<body>
<form>
<div>
<div>
Header
</div>
<div>
Content
</div>
<div>
Navigation.
</div>
<div>
List
</div>
<div>
Summary info
</div>
</div>
</form>
</body>
</html>


-------------- Script -------------


Example = function(){
return {
init : function(){
var layout = new YAHOO.ext.BorderLayout(document.body, {
north: {
split:false,
initialSize: 93
},
west: {
split:true,
initialSize: 200,
titlebar: true,
collapsible: true,
animate: true
},
center: {
autoScroll: true
}
});
layout.beginUpdate();
layout.add('north', new YAHOO.ext.ContentPanel('header', {fitToFrame:true}));
layout.add('center', new YAHOO.ext.ContentPanel('content', {fitToFrame:true}));

var innerLayout = new YAHOO.ext.BorderLayout('content', {
south: {
split:true,
autoScroll:false,
collapsible:true,
titlebar: true
},
center: {
autoScroll:true
}
});

innerLayout.add('south', new YAHOO.ext.ContentPanel('inner1', {title:"Summary",fitToFrame:true}));
innerLayout.add('center', new YAHOO.ext.ContentPanel('inner2',{fitToFrame:true}));

layout.add('west', new YAHOO.ext.NestedLayoutPanel(innerLayout,"List"));

layout.endUpdate();
}
}

}();
YAHOO.ext.EventManager.onDocumentReady(Example.init, Example, true);

jack.slocum
26 Nov 2006, 3:51 PM
The code looks fine (by the way if you check "Disable HTML" it wont strip all your tags). Is it possible to put up a link? There's nothing obvious wrong that I can see but if I saw it in a page something might come to me. :)

I was nervous about the new site... you really think it looks good?

donalconlon
26 Nov 2006, 4:16 PM
I'll see if I can post it someplace. Yes I think the new site looks great. Very sharp and professional looking. You pick colors well (well, blues at least!).

donalconlon
26 Nov 2006, 4:43 PM
Jack,

Can you see this? http://donalconlon.brinkster.net/projects.htm

Also, the 'content' div does not seem to be displaying.

Cheers!

donal

donalconlon
26 Nov 2006, 4:47 PM
I had the innerLayout referring the wrong div (content instaed of nav), hence the content div not displaying!

Thanks!

jack.slocum
26 Nov 2006, 6:04 PM
I get a 404. :(

Clean and professional was what I looking for. Thanks!