Config Toolbar.addButton - Ext JS

I was wondering if anyone else had noticed any problems with the addButton method in the toolbar. It appears that none of the old configurations work in this new release. For example, I'm using it to create a button like this:

Frame.tagtb.addButton({id:'add-tag-btn', text: 'Create Tag', className: 'add-tag', handler: Frame.showAddTag.createDelegate(Frame)});

This was working in 0.33 and 0.4, but it does not appear to be working in this new release. I noticed this problem because I was trying to set an alignTo to add-tag-btn and I get the error:

[Exception... "'Element.alignTo with an element that doesn't exist' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no]

I'm calling the alignTo like this:

addTag.alignTo('add-tag-btn', 'tl', [-77,1]);

The only other additional thing that makes me wonder about Button creation is that my CSS file isn't passing to the button either. Thanks for any help that you can provide.

#2   02-24-2007, 07:33 PM

The id is no longer applied, but can be used to get the button from the toolbar items collection. I can add it back it. The toolbar buttons now extend Ext.Button and siblings instead of having their own (duplicate) classes. All of the old functionality still exists only it may have a different name. e.g. className is the Ext standard cls, etc.

#3   02-24-2007, 07:53 PM

Jack, it would help me if it was added back in, because I was aligning the div dialog to the button that was added. If there were a better way to align that dialog I would do it. The other thing is that the button used to have a depressed state but that no longer happens. Is there something that needs to be added to the button?

#4   02-24-2007, 08:01 PM

depressed state ?

#5   02-24-2007, 08:12 PM

The visual cue to know that the button in the toolbar is pressed. Actually, this could be a CSS issue, and I just need to do it correctly in a custom CSS. The 0.4 release had some beveled appearance so that when the use pressed down on the button, it would have a pressed state. How long would it take to add the id portion back to the button code? If I wanted to customize some of the code, could I do this?

#6   02-24-2007, 08:39 PM

Ext.Button.prototype.render = Ext.Button.prototype.render.createSequence(function(){ if(this.id) this.el.dom.id = this.id; }); That should add it back in globally. The pressed state is in the button, not sure about all themes.

#7   02-24-2007, 09:33 PM

I'm using the aero theme, and the pressed state doesn't appear to be in that theme. Also, where should I add the posted code into the ext-all-debug.js and are you going to add back into the release?

#8   02-24-2007, 11:25 PM

Ext.Buttons seem to look the same on all themes. The depressed state is (only) signaled by a different background gradient which is a bit subtle, so it doesn't look particularly pressed down.

#9   02-25-2007, 05:30 AM

You can include that anywhere after ext-all.js. You don't have to modify the code. Aero toolbar button do indeed have a pressed state. Look at the toolbar/menu example in Aero and toggle the toggle button. That toggle state is the pressed state.