Apache Struts 2 Documentation > Home > Guides > Tag Developers Guide > Struts Tags > Tag Reference > UI Tag Reference > tabbedPanel
Added by Jay Bose, last edited by Musachy Barroso on Sep 22, 2007  (view change)

To use this tag:

  • Add: <%@ taglib prefix="sx" uri="/struts-dojo-tags" %> to your page.
  • The head tag must be included on the page, which can be configured for performance or debugging purposes.
  • If the parseContent parameter for the head tag is false (it is false by default), then the id tag is required.
Additional Examples

For more examples see Ajax and JavaScript Recipes

Description

The tabbedpanel widget is primarily an AJAX component, where each tab can either be local content or remote content (refreshed each time the user selects that tab).

If the useSelectedTabCookie attribute is set to true, the id of the selected tab is saved in a cookie on activation. When coming back to this view, the cookie is read and the tab will be activated again, unless an actual value for the selectedTab attribute is specified.

If you want to use the cookie feature, please be sure that you provide a unique id for your tabbedpanel component, since this will also be the identifying name component of the stored cookie.

Parameters

Dynamic Attributes Allowed:

false
 

Name

Required

Default

Evaluated

Type

Description

accesskey false false String Set the html accesskey attribute on rendered html element
afterNotifyTopics false false String Comma delimmited list of topics that will published after the request(if the request succeeds)
ajaxAfterValidation false false false Boolean Make an asynchronous request if validation succeeds. Only valid if 'validate' is 'true'
beforeNotifyTopics false false String Comma delimmited list of topics that will published before the request
cssClass false false String The css class to use for element
cssErrorClass false false String The css error class to use for element
cssErrorStyle false false String The css error style definitions for element to use
cssStyle false false String The css style to use for element
disabled false false String Set the html disabled attribute on rendered html element
errorNotifyTopics false false String Comma delimmited list of topics that will published after the request(if the request fails)
errorText false false String The text to display to the user if the is an error fetching the content
executeScripts false false false Boolean Javascript code in the fetched content will be executed
formFilter false false String Function name used to filter the fields of the form.
formId false false String Form id whose fields will be serialized and passed as parameters
handler false false String Javascript function name that will make the request
highlightColor false none false String Color used to perform a highlight effect on the elements specified in the 'targets' attribute
highlightDuration false 2000 false Integer Duration of highlight effect in milliseconds. Only valid if 'highlightColor' attribute is set
href false false String The URL to call to obtain the content. Note: If used with ajax context, the value must be set as an url tag value.
id false false String The id to use for the element
indicator false false String Id of element that will be shown while making request
javascriptTooltip false false false Boolean Use JavaScript to generate tooltips
key false false String Set the key (name, value, label) for this particular component
label false false String Label expression used for rendering an element specific label
labelSeparator false : false String String that will be appended to the label
labelposition false false String Define label position of form element (top/left)
listenTopics false false String Topic that will trigger the remote call
loadingText false Loading... false String Text to be shown while content is being fetched
name false false String The name to set for element
notifyTopics false false String Comma delimmited list of topics that will published before and after the request, and on errors
onblur false false String Set the html onblur attribute on rendered html element
onchange false false String Set the html onchange attribute on rendered html element
onclick false false String Set the html onclick attribute on rendered html element
ondblclick false false String Set the html ondblclick attribute on rendered html element
onfocus false false String Set the html onfocus attribute on rendered html element
onkeydown false false String Set the html onkeydown attribute on rendered html element
onkeypress false false String Set the html onkeypress attribute on rendered html element
onkeyup false false String Set the html onkeyup attribute on rendered html element
onmousedown false false String Set the html onmousedown attribute on rendered html element
onmousemove false false String Set the html onmousemove attribute on rendered html element
onmouseout false false String Set the html onmouseout attribute on rendered html element
onmouseover false false String Set the html onmouseover attribute on rendered html element
onmouseup false false String Set the html onmouseup attribute on rendered html element
onselect false false String Set the html onselect attribute on rendered html element
openTemplate false false String Set template to use for opening the rendered html.
parseContent false true false Boolean Parse returned HTML for Dojo widgets
required false false false Boolean If set to true, the rendered element will indicate that input is required
requiredposition false false String Define required position of required form element (left|right)
separateScripts false true false String Run scripts in a separate scope, unique for each tag
showErrorTransportText false true false Boolean Set whether errors will be shown or not
showLoadingText false false false Boolean Show loading text on targets
tabindex false false String Set the html tabindex attribute on rendered html element
targets false false String Comma delimited list of ids of the elements whose content will be updated
template false false String The template (other than default) to use for rendering the element
templateDir false false String The template directory.
title false false String Set the html title attribute on rendered html element
tooltip false false String Set the tooltip of this particular component
tooltipConfig false false String Deprecated. Use individual tooltip configuration attributes instead.
tooltipCssClass false StrutsTTClassic false String CSS class applied to JavaScrip tooltips
tooltipDelay false Classic false String Delay in milliseconds, before showing JavaScript tooltips
tooltipIconPath false false String Icon path used for image that will have the tooltip
transport false XMLHTTPTransport false String Transport used by Dojo to make the request
validate false false false Boolean Perform Ajax validation. 'ajaxValidation' interceptor must be applied to action
value false false String Preset the value of input element.

Examples

The following is an example of a tabbedpanel and panel tag utilizing local and remote content:

<s:tabbedpanel id="test" >
   <s:div id="one" label="one" theme="ajax" labelposition="top" >
       This is the first pane<br/>
       <s:form>
           <s:textfield name="tt" label="Test Text"/>  <br/>
           <s:textfield name="tt2" label="Test Text2"/>
       </s:form>
   </s:div>
   <s:div id="three" label="remote" theme="ajax" href="/AjaxTest.action" >
       This is the remote tab
   </s:div>
</s:tabbedpanel>

Use notify topics to prevent a tab from being selected:

<script type="text/javascript">
dojo.event.topic.subscribe("/beforeSelect", function(event, tab, tabContainer){
    event.cancel = true;
});
</script>

<s:tabbedpanel id="test" beforeSelectTabNotifyTopics="/beforeSelect">
   <s:div id="three" label="remote" theme="ajax" href="/AjaxTest.action" >
       One Tab
   </s:div>
   <s:div id="three" label="remote" theme="ajax" href="/AjaxTest.action" >
       Another tab
   </s:div>
</s:tabbedpanel>