PDA

View Full Version : Extjs 4.1.1rc2 : problem with firefox, using hbox in a form panel in a window



Follon
3 Jul 2012, 12:34 AM
Hi,

I have some problems with my code wich doesn't work on firefox.

What I want to do is to show a form panel in a modal window with combobox to fill.

The problem is that the combobox are not shown on firefox. If I use chrome, it works. If I put in comment "layout:'hbox'", I can see the combobox in firefox. Please, take a look at the pictures below.

Here is my code :


Ext.define('main.WindowForm', {


form:null,
windowCondition:null,
constructor : function(){
this.form = Ext.create('Ext.form.Panel', {
title: 'FieldContainer Example',
bodyPadding: 10,
items: [{
xtype: 'fieldcontainer',
fieldLabel: 'Last Three Jobs',
labelWidth: 100,
layout: 'hbox',
// The body area will contain three text fields, arranged
// horizontally, separated by draggable splitters.

items: [{
xtype: 'combo',
flex: 1
}, {
xtype: 'splitter'
}, {
xtype: 'combo',
flex: 1
}, {
xtype: 'splitter'
}, {
xtype: 'combo',
flex: 1
}]
}]
})

this.windowCondition = Ext.create('Ext.window.Window', {
title: 'Form',
width:800,
height:150,
minWidth: 300,
minHeight: 150,
closeAction:'destroy',
modal : true,
layout: 'fit',
items:this.form,

dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
ui: 'footer',
layout: {
pack: 'center'
},
items: [{
minWidth: 80,
text: 'Ok',
handler:function(){
}

},{
minWidth: 80,
text: 'Cancel',
handler:function(){
}
}]
}]
});
this.windowCondition.show();
}

});


First picture is what I get with Chrome, second is what I get with firefox if I comment layout:'hbox' and third is what I get with firefox if I use layout:'hbox'

skirtle
3 Jul 2012, 1:46 AM
Your code works fine for me using Firefox 13.0.1 and 4.1.1-RC2.

Follon
3 Jul 2012, 4:17 AM
Hi skirtle, thank you for your reply.

As the code is not the problem, I looked somewhere else and found that it was my own ext js theme which was the problem.

I see the combobox by using Ext-all.css