PDA

View Full Version : tabpanel autoScroll problem



Srikanth474
18 Mar 2012, 2:39 PM
Hi,
i am creating a application using extjs.i am using border layout and in the center region I am using hbox layout. the first hbox has three items and one of it is a tabpanel. the tab panel is taking 67% of height. i have different items in tabpanel. the first item in tab panel is a form panel and it has dynamic fieldsets in it. and i am not mentioning any height in that panel. when i add dynamic fieldset i need a scroll bar.when i use autoScroll:true, i am not getting any scrollbar. but when i click on another tab and comeback to the first tab i am seeing a scrollbar. if i mention height in pixels in the first tab it works fine, but i dont want to mention pixels as our users are using monitors with different display pixels.


code snippet of the tabpanel.

{
xtype: 'panel',
flex: 1.2,
items: [
{xtype:'contractDetailPanel'},
{
height:'67%',
activeTab: 0,
layout:'fit',
// autoScroll:true,
xtype:'tabpanel',
items: [{
autoScroll:true,
title: getText("tab.contract.applicants"),
itemId: 'contratApplicatDetail',
xtype:'applicantsPanel',
}, {
title: getText("tab.contract.collateral"),
itemId: 'contractItemizationDetail',
xtype:'contractItemsPanel',
}, {
title: getText("tab.contract.downPayemnts.tradeIn"),
itemId: 'downpaymentsItemizationDetail',
xtype:'downPaymentsItemsPanel'

}, {
title: getText("tab.contract.residual.payments"),
itemId: 'residualAndPaymentDetail',
xtype:'residualAndPaymentItemsPanel'

}, {
title: getText("tab.contract.payment.inception.amount.advance"),
itemId: 'paymentsatInceptionDetail',
xtype:'paymentAtInceptionItemsPanel'

},
{
title: getText("tab.contract.correction.letters"),
itemId: 'contractCorrectionLetters',
xtype:'correctionLettersItemsGrid',

}, {
title: getText("tab.contract.exceptions"),
itemId: 'contractExceptions',
xtype:'contractExceptionsItemsGrid',

}],
renderTo : Ext.getBody()
},

Help needed,
Thanks
Srikanth

voodoov
19 Mar 2012, 3:22 AM
Hi,

As I mentioned in this (http://www.sencha.com/forum/showthread.php?188354-Fieldset-height-100&p=759200&viewfull=1#post759200) post, I think it's better to handle height values in Pixels instead of Percents, because of cross-browser issues.
So if you handle it manually in pixels, maybe you can solve your problem. Something link this:


{
xtype: 'tabpanel',
listeners: {
render: function(obj) {
obj.setHeight( Ext.getCmp('parentCmp').getHeight() * 0.67 ); // parentCmp = [your parent component id]
}
}
}

Srikanth474
19 Mar 2012, 5:51 PM
Hi,
I changed my tabpanel to pixel, i am getting vertical and horizontal scrollbars. but i dont want to have vertical scrollbar. is there a way to not have the vertical scrollbar.

Thanks

voodoov
20 Mar 2012, 9:32 PM
Hi,

Not showing the vertical scrolls instead of horizontal one? It's not logical for me.

It depends on your tabpanel content.
Explain your content in more details with your codes.