PDA

View Full Version : Ext.Window is not taking height parameter (not expanding)



Vinni
26 Apr 2010, 1:42 AM
Hi,

I am new beginner in ExtJS. I am trying to put some elements on a Ext.Window but the last elements are getting cut off. Am not able to increase Ext.Window height.



var formSt = new Ext.form.FormPanel({
id: 'stForm',
region: 'center',
labelAlign: 'left',
bodyStyle: 'padding: 15px;',
items: [
textfieldName, // specified width
combotest1, // specified width
combotest2, // specified width
formStType, // panel specified with width, height and layout:absolute
fieldset1,
fieldset2
]
});

// create the window
windowSt = new Ext.Window({
id: 'stWindow',
modal: true,
resizable: false,
closable: false,
layout: 'border',
width:400,
height:900, // THIS IS NOT WORKING.. ???
title: 'Edit station template configuration',
bodyStyle: 'padding:15px;',
buttonAlign:'center',
items: [
formSt
],
buttons: [btnOk, btnCancel]
});

fieldset1 and fieldset2 is Ext.form.FieldSet with width, height specified and layout:'absolute'
I am specifying Ext.Window height:900, which is much larger to accomodate items. But Window is not taking it.

Here is attached screenshot.
20143

Please let me know the right way of doing this?

Thanks,
Vinni

Sgt.Pepper
26 Apr 2010, 2:11 AM
Hi,

is is working correctly, when you ommit the inner items:



var formSt = new Ext.form.FormPanel({
id: 'stForm',
region: 'center',
labelAlign: 'left',
bodyStyle: 'padding: 15px;',
items: [

]
});


var windowSt = new Ext.Window({
id: 'stWindow',
modal: true,
resizable: false,
closable: false,
layout: 'border',
width:400,
height:900, // IT'S WORKING NOW
title: 'Edit station template configuration',
bodyStyle: 'padding:15px;',
buttonAlign:'center',
items: [
formSt
],
buttons: []
});

windowSt.show();Try adding back the inner items to the Form and then the buttons to the Window. You will see when it fails to accept the height

Vinni
26 Apr 2010, 2:56 AM
I removed all the items, only added the first Textfield



var formSt = new Ext.form.FormPanel({
id: 'stForm',
region: 'center',
labelAlign: 'left',
bodyStyle: 'padding: 15px;',
items: [
textfieldName
]
});

textfieldName = new Ext.form.TextField({
id: 'stName',
fieldLabel: 'Template Name',
name: 'name',
style:'margin-top:3px;margin-bottom:3px;',
width: 225
});


Still the Window is not taking the specified height:1500
width:400,
height:1500,

Sgt.Pepper
26 Apr 2010, 4:19 AM
You are not trying to assign a "new Ext.form.Textfield" after the definition of formSt ??

Anyway, this code works perfectly for me:



var textfieldName = new Ext.form.TextField({
id: 'stName',
fieldLabel: 'Template Name',
name: 'name',
style:'margin-top:3px;margin-bottom:3px;',
width: 225
});
var formSt = new Ext.form.FormPanel({
id: 'stForm',
region: 'center',
labelAlign: 'left',
bodyStyle: 'padding: 15px;',
items: [
textfieldName
]
});




var windowSt = new Ext.Window({
id: 'stWindow',
modal: true,
resizable: false,
closable: false,
layout: 'border',
width:400,
height:900, // IT'S WORKING NOW
title: 'Edit station template configuration',
bodyStyle: 'padding:15px;',
buttonAlign:'center',
items: [
formSt
],
buttons: []
});

windowSt.show();



Which Ext version are you using?

Vinni
27 Apr 2010, 1:28 AM
The problem is for Ext.Window if I set resizable: true, height:900 and change the size of window manually by expanding the window with mouse, it stays with that shape and reopen with the set size. (on window.show() and Window.close())

Now I changed the code and put resizable: false, height:900,
on again reloading the webpage, the previously set Window size (manual setting) remains and height parameter does not make any difference!

Why the manual setting is not getting cleared on resizable: false??
I don't know how to fix this behavior. Please help.

Condor
27 Apr 2010, 1:49 AM
This is probably a "state kept in a cookie" issue.

Try configuring your window with stateful:false or clear your path cookie.

Vinni
27 Apr 2010, 3:55 AM
stateful:false, //This works!

Thanks a ton :)