ToolbarButton.disabled

[yui-ext is cool]

It appears that disabling toolbar buttons is not working in .33 RC1

in YAHOO.ext.ToolbarButton.prototype, it appears that this.el is being reset to nothing somewhere. Additionally, once you get to the mouseover event, this.disabled property is being reset to false as well.

To reproduce:



var toolBar =
{
init : function()
{
this.toolBar = new YAHOO.ext.Toolbar('divToolbar');
this.btnSave = new YAHOO.ext.ToolbarButton({text: 'Save', tooltip: 'Save Image', className: 'toolBarButtonSave'});
this.toolBar.addButton(this.btnSave);
this.btnSave.disable();

}
}



after calling toolBar.init(); The toolbar is built and renders correctly, but the button does not appear disabled and the mouseover, click etc events are still triggered.

if you check the value of toolBar.btnSave.isDisabled() after rendering, it returns true.

if you check the value of this.el in the disable function, it returns undefined.

if you check the value in the mouseover event, this.disabled = false;

I'm kind of stumped on this one.

[jack.slocum]

The problem is addButton takes a button config, not an actual button. There are two ways to do the same as you are doing:


this.toolBar = new YAHOO.ext.Toolbar('divToolbar');
this.btnSave = this.toolBar.addButton({text: 'Save', tooltip: 'Save Image', className: 'toolBarButtonSave'});
this.btnSave.disable();

or:


this.toolBar = new YAHOO.ext.Toolbar('divToolbar');
this.btnSave = new YAHOO.ext.ToolbarButton({text: 'Save', tooltip: 'Save Image', className: 'toolBarButtonSave'});
this.toolBar.add(this.btnSave);
this.btnSave.disable();

Since this may be a common thing, I did change the dev code so if you pass a ToolbarButton to addButton it will just defer to add().

[yui-ext is cool]

Thanks Jack, that did the trick.