Dialog will not show single toolbar button

[sderouchie]

SmartClient Version: v10.0p_2015-08-20/PowerEdition Deployment (built 2015-08-20)

Tested only with Firefox


I've got a progress dialog that is displayed with a single button to cancel the request. This dialog did not have any issues in SmartGWT 4.0, but after upgrading to SmartGWT 5.0, the cancel button is no longer displayed.

I have a PleaseWaitDialog that extends Dialog and does the following:

this.cancelButton = new Button( "Cancel" );
this.setToolbarButtons( this.cancelButton );

When it is executed, it shows the dialog as displayed in the attachment OneButton.PNG

---
Other dialogs in the software still work with SmartGWT 5.0 for displaying buttons. The only difference I could see was the number of buttons. Therefore, I added another button:

this.cancelButton = new Button("cancel" );
Button fakeButton = new Button( "f" );
this.setToolbarButtons( this.cancelButton, fakeButton );

When executed, it shows the dialog with buttons as displayed in attachment WithFakeButton.PNG
---

I tried forcing the toolbar to show with a call to setShowToolbar(true), but this made no difference. The only way I was able to show a single button was to create a fake hidden button:

this.cancelButton = new Button("cancel" );
Button fakeButton = new Button( "f" );
fakeButton.hide();
this.setToolbarButtons( this.cancelButton, fakeButton );

When executed, it shows the dialog with the single button as displayed in attachment WithFakeButtonHidden.PNG


Is there something I could be doing incorrectly for a single button?

[sderouchie]

Is there any more information required for looking into this issue?

Thanks,
Steven.

[Isomorphic]

We have everything we need, we're just looking at the best way to address the issue. Won't be long now.

[Isomorphic]

We've committed a fix for this issue for SGWT 5.0p and newer that will be in the nightly builds dated 2015-08-27. Note that you may need to explicitly set the width of the single button in your code.

With regard to the workaround that you posted. A simpler workaround would be:

this.cancelButton = new Button( "Cancel" );
this.setToolbarButtons( new Button[] { this.cancelButton } );

[sderouchie]

Thanks, I will get the latest version.

[sderouchie]

There still seems to be an issue. The button now shows up, but the onClick event never fires.

SmartClient Version: v10.0p_2015-08-28/PowerEdition Deployment (built 2015-08-28)

[Isomorphic]

We're not seeing any problem. Can you provide sample code?

[sderouchie]

I just have a simple class that extends a Dialog with a cancel button on the toolbar.
The onClick handler never gets called when I click the button.

public class PleaseWaitDialog extends Dialog {

	public PleaseWaitDialog( final String title, final CancelButtonListener listener ) {

		super();

		this.listener = listener;
		this.setWidth( PleaseWaitDialog.DIALOG_WIDTH );
		this.setHeight( PleaseWaitDialog.DIALOG_HEIGHT );
		this.setTitle( title );
		this.setIsModal( true );
		this.setShowModalMask( true );
		this.cancelButton = new Button( LocalizedConstantsFactory.getCommonConstants().cancel() );
		this.cancelButton.setWidth( PleaseWaitDialog.CANCEL_BUTTON_WIDTH );
		this.setToolbarButtons( this.cancelButton );
		this.cancelButton.addClickHandler( new ClickHandler() {

			@Override
			public void onClick( final ClickEvent event ) {

				PleaseWaitDialog.this.close();
				if ( null != PleaseWaitDialog.this.listener ) {
					PleaseWaitDialog.this.listener.cancel();
				}
				PleaseWaitDialog.this.markForDestroy();
			}
		} );
}

However, if I change the code to this, it will call the onClick handler when I click the cancel button:

		Button fakeButton = new Button( "f" );
		fakeButton.hide();
		this.cancelButton = new Button( LocalizedConstantsFactory.getCommonConstants().cancel() );
		this.cancelButton.setWidth( PleaseWaitDialog.CANCEL_BUTTON_WIDTH );
		this.setToolbarButtons( this.cancelButton, fakeButton );

[Isomorphic]

Thanks - we'll try your test code and let you know what we see

[Isomorphic]

We do see the issue you describe and are looking at how to address it.
You can workaround this for now by applying your clickHandler to the button *before* calling "setToolbarButtons()" on the Dialog.

Regards
Isomorphic Software

[Isomorphic]

The immediate problem is that when a single button is passed, it's assumed to be a configuration rather than a live object, so changes made to the cancelButton after the call to setToolbarButtons() don't have any effect on the Dialog. (A copy of the button's configuration is actually made internally.) So you just need to reorder your code to add the handler before the call to setToolbarButtons(). (This also explains why we thought there was no issue when we tested the handler capability ourselves.)

Going forward, we do intend to make changes to cause the handling of arrays of buttons and a single button to be identical for Dialog.setToolbarButtons(), since it's really not possible to distinguish Buttons passed as configuration from those intended as live objects unless the underlying JS widgets have actually already been created. While this may solve your issue by eliminating the copy, it's still best practice to configure all widgets completely prior to passing them to other APIs, if possible, even if they're live and not just configuration.

[sderouchie]

Thanks for the good explanation on this. I will reorder the code.