smartGWT duplicate buttons

Question

I have 2 smartGWT buttonLayouts that contain save and cancel buttons. One at the top of the UI and one at the bottom for convenience, so the user doesn't have to scroll all the way up/down to save/cancel a form.

When a user selects save/cancel in either place all buttons should be disabled until background action is complete.

What's the best way to handle this?

If I do this:

private Layout buildTopButtonBar() {
  saveButton = new Button("Save");
  saveButton.addClickHandler( ... );
  buttonLayout.addMember(saveButton);
}

private Layout buildBottomButtonBar() {
  saveButton = new Button("Save");
  saveButton.addClickHandler( ... );
  buttonLayout.addMember(saveButton);
}

saveButton actions(when the user selects save, the saveButton should be disabled) in my clickHandler are only performed for the buttons in the bottom bar, though all other background actions work.

If I do this:

 saveButton = new Button("Save");
 saveButton.addClickHandler( ... ); 
 buildTopButtonBar();  // adds saveButton to top bar
 buildBottomButtonBar();  // adds saveButton to bottom bar

Only the bottom bar is displayed.

I could create 4 separate buttons:

 topSaveButton = new Button("Save");
 bottomSaveButton = new Button("Save");
 ... // add all required functionality and clickHandlers

But that just feels evil. Do I have any other options? This is smartGWT 4.

Answer 1

You can not reuse instances of widgets.

Button saveButton = new Button("Save"); // some more code saveButton.addClickHandler( ... ); buildTopButtonBar(); // adds saveButton to top bar buildBottomButtonBar(); // adds saveButton to bottom bar ;

will not work. Where as

Button topSaveButton = new Button("Save");
Button bottomSaveButton = new Button("Save");
... // add all required functionality and clickHandlers

will work.

Every widget represents a node in the DOM tree. You can access the node by calling getElement(). Adding the button again will remove the button on the top and add it to the bottom.

If you have a save button at the top and at the end, you need two instances.