Keep in mind that all Wicket validations will be validated, so we have to take care of the FeedbackPanel (refreshing) as well.

Example:

/**
	 * {@inheritDoc}
	 */
	@Override
	protected WebMarkupContainer newLink(String linkId, final int index) {

			return new AjaxSubmitLink(linkId, m_form) {

			@Override
			protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
				setSelectedTab(index);
				if (target != null) {
					target.addComponent(TabbedComponent.this);
				}
				onAjaxUpdate(target);
			}

			@Override
			protected void onError(AjaxRequestTarget target, Form<?> form) {
				target.addComponent(((FeedbackAware) getPage()).getFeedbackPanel());
			}
		};
	}

See also my other blog about the AjaxTabbedPanel and LazyLoading

What I want to achieve is that an AjaxIndicator (loading image) will be shown on the place were the actual panel will come till it is completely loaded. Especially when you have a lot of components to render this can be handy. See image below.

Example

My solution was to create a class (AbstractLazyLoadTab) on top of the AbstractTab (implements ITab) which will take care of this. It will use the AjaxLazyLoadPanel.

public abstract class AbstractLazyLoadTab extends AbstractTab {
         //removed some lines

	@Override
	public Panel getPanel(String panelId) {
		return new AjaxLazyLoadPanel(panelId){

			private static final long serialVersionUID = 1L;

			@Override
			public Component getLazyLoadComponent(String markupId) {
				return getLazyLoadPanel(final String markupId);
			}
		};
	}

        public abstract Panel getLazyLoadPanel(final String markupId);
}

Now you can use this class as you normally would do when you use AbstractTab.

When your page (or components higher in the hierarchy) implements IAjaxIndicatorAware to show another loading layer it is possible that you now have two loading layers on top of each other. One on the tab and one which will e.g. block the whole page. To avoid that I created an other class which extends the AjaxTabbedPanel and implements the IAjaxIndicatorAware interface.

public class TabbedComponent extends AjaxTabbedPanel implements IAjaxIndicatorAware{
         //removed some lines
        @Override
	public String getAjaxIndicatorMarkupId() {
		//Our tab will take care of the loading layer, so return null.
		return null;
	}
}

Now you can use the classes like this:

  List<ITab> tabs=new ArrayList<ITab>();
    tabs.add(new AbstractLazyLoadTab(new Model("first tab")) {
        public Panel getLazyLoadPanel(String panelId) {
           return new TabPanel1(panelId);
        }
    });

    add(new TabbedComponent("tabs", tabs)

Another solution

If you prefer to have a waiting icon on the right side of the tab itself, you can override the newLink method of AjaxTabbedPanel and use the IndicatingAjaxFallbackLink instead of the AjaxFallbackLink. You will probably have to add the following code to your css file.

span.wicket-ajax-indicator {
float: left;
}

More information about this solution please click here