PDA

View Full Version : newbie question, floating buttons



eyurdakul
3 May 2009, 4:32 AM
Hi gurus,

i am here again with another noob's question. This is my script simply:


var mainCnt = new Ext.Window({
//...configuration bla
listeners: {
render: function(){
for(i=0; i<50; i++){
mainCnt.add(new Ext.Button({
text: i,
id: 'nmr'+i
}));
}
}
}
});

So i add 50 buttons dynamically after the render event and it works. But i want to align them like i do with css float property so 5 lines and 10 rows. I've tried align to but i get error, alignTo is not a function. This is what i put in the foor loop:


if(i>0){
Ext.getCmp('nmr'+i).alignTo(Ext.getCmp('nmr'+(i-1)), 'r');
}

But it seems not to work. I've also tried to get the dom element with getEl and apply the function but it didn't help too. How can i solve this issue, any idea? Thanks in advance.

evant
3 May 2009, 4:36 AM
Put them in a layout. Look at the hbox/vbox examples.

eyurdakul
3 May 2009, 4:53 AM
i assume hbox layout is available for the layouts that has floating property. Buttons don't have that but i will try to put them in an additional container. Thanks for the hint.

eyurdakul
3 May 2009, 5:19 AM
i still get the same error:

Ext.Container.LAYOUTS[this.layout.toLowerCase()] is not a constructor

Animal
3 May 2009, 6:31 AM
It would seem obvious that the layout string which you are using is not a valid property of the Ext.Container.LAYOUTS hash. What are you using?

eyurdakul
3 May 2009, 5:55 PM
i am using hbox string for the layout. I've tried the hbox example of garcia, it seemed to work on example. I don't see any difference between my structure and his structure but hbox doesn't get recognised as layout type. I tought, button wouldn't support floating since button doesn't have floating property. So i put little Ext.Panels to avoid it and buttons inside the panels. But it didn' help either. I wendt one step further and copied garcia's script entirely but i get the same error. I've downloaded the same JS library and replaced it and still get the same error. When i add style: 'float: left' property, i don't get js error but layout gets messed up.

Condor
3 May 2009, 9:42 PM
Any reason you are not using the new ButtonGroup component?

(assuming you are using Ext 3.0, since you posted in the 3.0 forum)

Animal
3 May 2009, 11:49 PM
i am using hbox string for the layout. I've tried the hbox example of garcia, it seemed to work on example. I don't see any difference between my structure and his structure but hbox doesn't get recognised as layout type. I tought, button wouldn't support floating since button doesn't have floating property. So i put little Ext.Panels to avoid it and buttons inside the panels. But it didn' help either. I wendt one step further and copied garcia's script entirely but i get the same error. I've downloaded the same JS library and replaced it and still get the same error. When i add style: 'float: left' property, i don't get js error but layout gets messed up.

The box layouts are Ext 3.* only.

Why don't you use a table layout if you are using 2.2?

eyurdakul
4 May 2009, 1:42 AM
thanks animal it did the trick ;)