Intercepting tab selection [closed]

asked 2011-12-09 11:46:10 +0800

avidD gravatar image avidD
166 2

Hello colleagues,
I have the following problem:
I have various tabs for different groups of properties of resources that can be edited in forms on these tabs. Some of the tabs require unsaved changes to be applied or discarded before switching to certain other tabs. To implement this, I assigned the tabs to groups. Whenever the tab group changes, I open a dialog and ask the user to apply, discard, or cancel. Everything works fine now except that the tab is switched independently of my dialog.
So what I need to do is somehow intercept the the select-event sent to the tab(box) so that selectTabDirectly(...) is not called on the tab box if the user cancels switching of the tab. Does anyone know how to achieve that?

Thanks beforehand,

delete flag offensive retag edit

The question has been closed for the following reason "too localized" by sjoshi
close date 2013-02-08 07:22:37

15 Replies

Sort by ยป oldest newest

answered 2012-03-30 09:08:05 +0800

avidD gravatar image avidD
166 2

Hi, BTW after dealing with some other problems during the last months, we tried this out and it works great.

Thanks a lot!

link publish delete flag offensive edit

answered 2012-12-21 03:09:48 +0800

sassyshin gravatar image sassyshin

updated 2012-12-21 03:12:39 +0800

the Sample Code:Leave tab selection solution of jimmyshiau is my savior. but how to do this programmatically? I need to save the dirty tab first before actually leaving the tab.. i wish to do this code: w:_sel="switchTab" forward="onSwitchTab=onSwitchTab" on different controller but how?

link publish delete flag offensive edit

answered 2013-01-15 10:09:47 +0800

avidD gravatar image avidD
166 2

Hi sassyshin,
sorry for this late response but I was on holiday. Also, I cannot tell you much about it as it is already quite some time ago. But here is what I got:

We manage the currently focused tab in the view model (vm.focusTab) and we have included the above solution using switchTab and onSwitchTab

<tab id="mGeneralAttributes" 
             selected="@load(vm.focusTab eq 'mGeneralAttributes')" 

We also apply several composers to the window:


one of which handles tab switches. I understand this is what you aim to do, right?

In this composer we have the onSwitchTab(ForwardEvent) method which compares the tab groups and triggers saving when the group is to be switched. We use groups so as to allow switches between tabs in one group without saving:

  public void onSwitchTab(ForwardEvent event) throws InterruptedException {
    // event delivers target tab and origin tab
    final Tab tab = (Tab)event.getOrigin().getTarget();
    String tabNameTarget = event.getOrigin().getTarget().getId();
    String tabGroupTarget = mTabGroups.get(tabNameTarget);
    String tabNameOrigin = layer.getFocusTab();
    String tabGroupOrigin = mTabGroups.get(tabNameOrigin);
    ... // if save is required, ask for confirmation or cancel and save and switch if confirmed

Hope this helps,

link publish delete flag offensive edit

answered 2013-01-18 06:18:24 +0800

sansys gravatar image sansys

Thanks Jimmi.

You solution works great. This saved my day today.

Thanks once again.

link publish delete flag offensive edit

answered 2013-01-21 12:27:08 +0800

sansys gravatar image sansys

updated 2013-01-21 12:28:10 +0800


How to do the same, when tab is being created from server end, through Java code.

public void afterCompose(@ContextParam(ContextType.VIEW) Component view) {
	//Component tab
	Tabs tabs = (Tabs) view.getFellowIfAny("tabs");

	for(int i=0; i<5; i++) {
		Tab tab = new Tab();
		tab.setLabel("Tab " + i);
		tab.setWidgetListener("onSelect", "switch");

		tab.addEventListener("onSwitchTab", new EventListener() {

			public void onEvent(Event event) throws Exception {

				final Tab tab = (Tab) event.getTarget();
				String msg="Are you sure to leave " + tab.getLabel() + "?";
				if (hasDirty()) {
					Messagebox.show(msg, "Exit",
							Messagebox.OK | Messagebox.CANCEL,
							Messagebox.QUESTION, new EventListener() {

								public void onEvent(Event event)
										throws Exception {
									String evtName = event.getName();

									if (Messagebox.ON_OK.equals(evtName)) {
									} else if (Messagebox.ON_CANCEL
											.equals(evtName)) {
										// do nothing


				} else {

public boolean hasDirty(){
	return true;

My requirement is to check hasDirty for current tab. The tab should not be switched if some data is changed in form.



link publish delete flag offensive edit

Question tools




Asked: 2011-12-09 11:46:10 +0800

Seen: 750 times

Last updated: Jan 21 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More