View Full Version : Ext.nd.UIView height as a percentage?
mth96a
28 May 2008, 11:07 AM
Is this possible on a form?
var myApp = function(){
return {
init : function() {
var view1 = new Ext.nd.UIView({
viewName : 'by company',
viewTitle: "All by company",
toolbar : true,
showSingleCategory : 'Choose Company...' ,
showCategoryComboBox : true,
gridConfig: { renderTo: 'view1',
height : 100%}
});
}// end init
};// end 'return'
}();
RWaters
29 May 2008, 6:07 AM
I would need to look into the panel configs to see if percentage is supported for height. If it is you would need to surround it in quotes '100%'. If not you could probably give your view1 div a height of 100%. Since we set layout: 'fit' on the GridPanel that is created it should expand to fill up the entire container.
breckster
4 Jun 2008, 6:43 AM
I am using an Ext.TabPanel for site navigation. The items of this TabPanel are different instances Ext.nd.DominoUI. My issue is controlling the height of the content. I've tried everything I can think of. Currently I am using width:screen.availWidth and screen.availHeight. This works to some degree but has some irritating quirks.
Below is the snippet:
var tabs2 = new Ext.TabPanel({
renderTo: 'nav',
bodyBorder:false,
autoScroll:false,
border:true,
frame:false,
width:screen.availWidth,
height:screen.availHeight,
activeTab: 0,
plain:true,
items:[{
title: 'Home',
html:'<IFRAME BORDER="0" FRAMEBORDER="0" SCROLLING="disabled" src="/servicenet/sn.nsf/DUIH?OpenPage" width="100%" height="100%" align="center"> </IFRAME>'
},{
title: 'Quotes',
html:'<IFRAME BORDER="0" FRAMEBORDER="0" SCROLLING="disabled" src="/servicenet/sn.nsf/DUIQ?OpenPage" width="100%" height="100%" align="center"> </IFRAME>'
//html:''
},{
title: 'Projects',
html:'<IFRAME BORDER="0" FRAMEBORDER="0" SCROLLING="disabled" src="/servicenet/sn.nsf/DUIP?OpenPage" width="100%" height="100%" align="center"> </IFRAME>'
},{
title: 'Directory',
html:'<IFRAME BORDER="0" FRAMEBORDER="0" SCROLLING="disabled" src="/servicenet/sn.nsf/DUID?OpenPage" width="100%" height="100%" align="center"> </IFRAME>'
} }
]
});
Issues:
1. On dual monitors the "availHeight" thinks the windows task bar spans both monitors.This leaves an annoying blank space at the bottom of the screen on the monitor without the taskbar.
2. Window resizing doesn't trigger the re-rending of the contents of the tabpanel.
Any ideas would be appreciated
Thanks
breck
RWaters
4 Jun 2008, 6:54 PM
try giving the tabpanel a layout: 'fit', and make sure the 'nav' div is set to take up 100%
breckster
12 Jun 2008, 6:50 AM
Hi Rich
The layout:'fit' in the Config Options of the TabPanel throws is error in IE: "Object doesn't support this property". Firefox doesn't error but it doesn't render the tabs either.
I tried to add the layout:'fit' to the Items for the TabPanel and has no effect.
If I use Width:'100%' & Height:'100%' in the TabPanel config options,
Firefox: Handles the width correctly but the hieght is way too long. (scroll bars activate). However the content in the <div> will resize automatically when the browser window is resized.
Internet Explorer: Renders the TabPanel with style="WIDTH: 877px; HEIGHT: 150px" and browser resizing doesn't trigger the resizing of the content.
I've tried rendering the to the document.body and to the <div> using "<style>html, body {height: 100%;} #nav {min-height: 100%;}</style>" but with no luck.
Can you think of any other way of producing the desired output.
The goal is to run the multiple instances of the DominoUI concurrently in different layers so the "state" of the each instance is preserved while the user interacts with each instance as needed. I need the whole construct to automatically 'fit" and resize with the size of the browser window is changed.
Also, instead of item content of
html:'<IFRAME BORDER="0" FRAMEBORDER="0" SCROLLING="disabled" src="/servicenet/sn.nsf/DUIQ?OpenPage" width="100%"
can the item content be
new Ext.nd.DominoUI({
uiOutline : {outlineName: 'YourView',useOutlineIcons: true},
uiView : {viewName: 'YourViewName', viewUrl:'/your/view/url', viewTitle: 'View Title'}
});
Maybe the wrapping the content in another <IFRAME> is whats causing the issue.
Any thoughts
Thanking you in advance
Breck
Powered by vBulletin® Version 4.1.5 Copyright © 2012 vBulletin Solutions, Inc. All rights reserved.