TabSetProxy

Table of Contents

Overview

Since 2.0

The ace:tabSetProxy component works in conjunction with its associated server side ace:tabSet, so that the ace:tabSet need not be inside a form, but can still communicate with the server, when it changes its current tab. The purpose of this is so that ace:tabPane components may have forms within them, and since forms can not be nested, ace:tabSet needed to be freed from the requirement to be inside a form itself. As well, since ace:tabSet's immediate and cancelOnInvalid properties control the interaction of the changing of current tab selection, with the validation of input components in the submitted form, ace:tabSetProxy is the means for specifying which form, anywhere on the page, should host the submission of the tab change. So, when the current tab changes, it is the form that the ace:tabSetProxy is in, which is submitted.

See the ICEfaces Showcase Live Demo of this component, complete with source code.

Getting Started

To use the ace:tabSetProxy component, first the ACE Components tag-lib name-space has to be added in your page.

<html ... xmlns:ace="http://www.icefaces.org/icefaces/components">
Now you ready to use ace:tabSetProxy component, here is the basic example:

<h:form>
   <ace:tabSetProxy for=":myTabSet" />
</h:form>

<ace:tabSet clientSide="false" id="myTabSet">
    <ace:tabPane label="Tab One">
        <h:outputText value="Contents of tab one"/> <br/>
    </ace:tabPane>
    <ace:tabPane label="Tab Two">
        <h:outputText value="Contents of tab one" />
    </ace:tabPane>
</ace:tabSet>

Attributes

TagLib Documentation
This section covers attributes involved in the typical use-cases for this component. For reference, the complete taglib documentation for this component is available here.

for specifies how to find the ace:tabSet that this ace:tabSetProxy is associated with. There is a misconception that for takes an id or a clientId, but in reality for is a search path to another component, that can either be relative from the current component, or absolute, which is really relative from the UIViewRoot. To specify an absolute search path, prepend it with a colon.

Note that search strings are similar to clientIds, in that they are a concatenation of the ids of NamingContainers and then the desired component, all delimited with colons. They are inherently designed to search downwards/inwards from the nearest parent/ancestor NamingContainer, and don't handle searching upwards/outwards, like a ../.. file path would.

Using tabSetProxy with ace:ajax

The ace:tabSetProxy component can be used in conjunction with the ace:ajax component, with certain limitations.

The ace:ajax component must be specified on the ace:tabSet component, and not on the ace:tabSetProxy component.

<ace:tabSet clientSide="false" id="myTabSet">
    <ace:tabPane label="Tab One">
        <h:outputText value="Contents of tab one"/> <br/>
    </ace:tabPane>
    <ace:tabPane label="Tab Two">
        <h:outputText value="Contents of tab one" />
    </ace:tabPane>

    <ace:ajax execute="@this" render="@all"/>

</ace:tabSet>

<h:form>
   <ace:tabSetProxy for=":myTabSet" />
</h:form>

In addition, if the ace:tabSet itself is not inside a form and instead ace:tabSetProxy is being used, it is not valid to:

  • Specify an ace:ajax with "execute='@form'" in the tabSet.
  • Specify the tabSetProxy's form ID in its execute attribute.

Known Issues

Additional Resources

Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.

© Copyright 2018 ICEsoft Technologies Canada Corp.