PDA

View Full Version : GroupTabPanel doesn't render well on FFOX???



mauro_monti
7 Aug 2009, 8:23 AM
Hi people,

I have the next problem: I'm using the groupTab widget, and i need to put this component on center region of the Border Layout.
I've tested my code on both browser, ffox and ie7. On ie7 the component looks well, but on ffox, the center panel different.

I've tested changing my code, but i always get the same result.

The code:

application.js



Ext.namespace('dst');

dst.application = function() {
return {
init: function(){
Ext.QuickTips.init();

var viewport = new Ext.Viewport({
layout: 'border',

items: [{
region: 'north',
height: 65,
html: 'DST-WEB'
},{
region: 'center',
layout: 'fit',
items: [{
xtype: 'grouptabpanel',
tabWidth: 150,

activeGroup: 0,
items: [{
items: [{
title: 'Daily Status.',
iconCls: 'x-icon-daily-status',
tabTip: 'Manage user daily status.',

layout: 'fit',
items: []
}, {
title: 'Request\'s Dashboard',
tabTip: 'Complete user daily task, activities, etc.',
iconCls: 'x-icon-dashboard',

layout: 'fit',
items: []
}]
}, {
items: [{
title: 'Configuration',
iconCls: 'x-icon-configuration',
tabTip: 'Manage activities, task, request, technologies, users, etc.',

layout: 'fit',
items: []
}, {
title: 'Users',
iconCls: 'x-icon-configuration-users',
tabTip: 'Manage application users.',

layout: 'fit',
items: []
}, {
title: 'Alerts',
iconCls: 'x-icon-configuration-alerts',
tabTip: 'Manage e-mail alerts.',

layout: 'fit',
items: []
}, {
title: 'Request\'s',
iconCls: 'x-icon-configuration-requests',
tabTip: 'Manage request\'s.',

layout: 'fit',
items: []
}]
}]
}]
}]
});
});

};
}();


index.jsp



<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title></title>

<!-- ** CSS ** -->
<!-- Base styles -->
<link rel="stylesheet" type="text/css" href="./lib/extjs/resources/css/ext-all.css">

<!-- User defined -->
<link rel="stylesheet" type="text/css" href="./lib/ux/css/ux-all.css" />
<link rel="stylesheet" type="text/css" href="./app/css/application.css" />

<!-- ** Javascript ** -->
<!-- Base Libraries -->
<script type="text/javascript" src="./lib/extjs/adapter/ext/ext-base-debug.js"></script>
<script type="text/javascript" src="./lib/extjs/ext-all-debug.js"></script>

<!-- User defined libraries -->
<script type="text/javascript" src="./ejn/ejn-assert.js"></script>
<script type="text/javascript" src="./djn/djn-remote-call-support.js"></script>
<script type="text/javascript" src="./dst/Api.js"></script>

<script type="text/javascript" src="./lib/ux/ux-all-debug.js"></script>

<!-- Application -->
<script type="text/javascript" src="./app/application.js"></script>
</head>
<body>

<script type="text/javascript">
Ext.onReady(dst.application.init, dst.application);
</script>

</body>
</html>


Thank's.
Mauro

PV-Patrick
16 Dec 2009, 12:24 AM
I am all of a sudden having the same issue...

It was working fine when I first implemented it and I believe I was running 3.0.0 - Since upgrading to 3.0.3 and revisiting the page, I noticed that in FireFox only it is displaying the same way as shown in the authors attached images. It does work correctly in the following browsers during testing: IE8, Safari 4.0.4, Opera 10.10, Chrome 3.0.195.38.

Any help on this issue would be appreciated, thank you!

lorezyra
17 Jul 2010, 4:51 AM
I still see this issue as the OP shows above with FF 3.6.6.

Any chance this will be fixed?

aurelien
27 Dec 2010, 11:45 PM
Hello all!

I've got this issue too on FF 3.6.13 on Mac OS with last ExtJS version 3.3.1.

Did this issue be resolved by someone?

Thanks,
Aurelien