Hi,
I'm trying to split up my form (using <s:form>) into different tabs. I've
already searched the internet, but haven't found much information about it.
If anyone could send me a sample, or a link to a page describing how to do
this, that would be most helpfull.
Sample struts-page I want to split up in different tabs :
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ include file="taglibs.jsp" %>
<%String styleVar = (String) session.getAttribute("style");%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd";>
<html>
<head>
<%@ include file="header.jsp" %>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<jsp:include page="<%=styleVar+\"-styles.jsp\"%>" />
<link type="text/css" rel="stylesheet"
href="/struts/js/jquery.autocomplete.css">
<script type="text/javascript"
src="/struts/js/jquery.autocomplete.js"></script>
</head>
<jsp:include page="<%=styleVar+\"-heading.jsp\"%>" />
<p><span class="tit">ArtikelNummer Entry</span></p><br/>
<s:actionerror />
<s:fielderror></s:fielderror>
<s:form action="artikelNummer-confirm">
<s:hidden name="nextEventId"/>
<s:hidden name="artikelNummerOid" />
<s:textfield name="artikelNummerName" class="formTable" label="Name"/>
<s:set name="dt_name" value="displayType['name']" />
<s:if
test="(#dt_name == null) || (#dt_name.name() == null)">
<s:set name="dtv_name" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_name" value="#dt_name.name()" />
</s:else>
<s:if test="(#dtv_name == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_name == 'LABEL')">
<s:label id="name" key="artikelNummerDetails.name" class="formTable2"
label="Name" />
</s:elseif>
<s:elseif test="(#dtv_name == 'READONLY')">
<s:textfield id="name" key="artikelNummerDetails.name" class="formTable"
label="Name" readonly="true" />
</s:elseif>
<s:else>
</s:else>
<s:set name="dt_omschrijving" value="displayType['omschrijving']" />
<s:if
test="(#dt_omschrijving == null) || (#dt_omschrijving.name() == null)">
<s:set name="dtv_omschrijving" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_omschrijving" value="#dt_omschrijving.name()" />
</s:else>
<s:if test="(#dtv_omschrijving == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_omschrijving == 'LABEL')">
<s:label id="omschrijving" key="artikelNummerDetails.omschrijving"
class="formTable2" label="Omschrijving" />
</s:elseif>
<s:elseif test="(#dtv_omschrijving == 'READONLY')">
<s:textfield id="omschrijving" key="artikelNummerDetails.omschrijving"
class="formTable" label="Omschrijving" readonly="true" />
</s:elseif>
<s:else>
<sjr:ckeditor id="omschrijving" label="Omschrijving"
name="artikelNummerDetails.omschrijving"
value="%{artikelNummerDetails.omschrijving}"
rows="10" cols="80" width="800"/>
</s:else>
<s:set name="dt_functioneleCode" value="displayType['functioneleCode']" />
<s:if
test="(#dt_functioneleCode == null) || (#dt_functioneleCode.name() ==
null)">
<s:set name="dtv_functioneleCode" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_functioneleCode" value="#dt_functioneleCode.name()" />
</s:else>
<s:if test="(#dtv_functioneleCode == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_functioneleCode == 'LABEL')">
<s:label id="functioneleCode" key="artikelNummerDetails.functioneleCode"
class="formTable2" label="Functionele code" />
</s:elseif>
<s:elseif test="(#dtv_functioneleCode == 'READONLY')">
<s:textfield id="functioneleCode"
key="artikelNummerDetails.functioneleCode" class="formTable"
label="Functionele code" readonly="true" />
</s:elseif>
<s:else>
<!-- custom -->
<tr>
<td><s:a action="functioneleCode-entry" id="f1"
target="_blank">nieuw.</s:a></td>
</tr>
<s:url id="myUrl" namespace="" action="artikelNummer-functioneleCode" />
<sx:autocompleter
name="artikelNummerDetails.functioneleCode.name"
id="artikelNummerDetails.functioneleCode.id"
keyName="artikelNummerDetails.functioneleCode.id"
href="%{myUrl}"
loadOnTextChange="true"
label="Functionele code"
loadMinimumCount="1"
forceValidOption="true"
autoComplete="true"
preload="true"
/>
<!-- /custom -->
</s:else>
<s:set name="dt_arpaCode" value="displayType['arpaCode']" />
<s:if
test="(#dt_arpaCode == null) || (#dt_arpaCode.name() == null)">
<s:set name="dtv_arpaCode" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_arpaCode" value="#dt_arpaCode.name()" />
</s:else>
<s:if test="(#dtv_arpaCode == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_arpaCode == 'LABEL')">
<s:label id="arpaCode" key="artikelNummerDetails.arpaCode"
class="formTable2" label="Arpa code" />
</s:elseif>
<s:elseif test="(#dtv_arpaCode == 'READONLY')">
<s:textfield id="arpaCode" key="artikelNummerDetails.arpaCode"
class="formTable" label="Arpa code" readonly="true" />
</s:elseif>
<s:else>
<!-- custom -->
<tr>
<td><s:a action="arpaCode-entry" target="_blank">nieuw</s:a></td>
</tr>
<s:url id="myUrl" namespace="" action="artikelNummer-arpaCode" />
<sx:autocompleter
name="artikelNummerDetails.arpaCode.name"
id="artikelNummerDetails.arpaCode.id"
keyName="artikelNummerDetails.arpaCode.id"
href="%{myUrl}"
loadOnTextChange="true"
label="Arpa code"
loadMinimumCount="1"
forceValidOption="true"
autoComplete="true"
preload="true"
/>
<!-- /custom -->
</s:else>
<s:set name="dt_boekhoudkundigeSleutel"
value="displayType['boekhoudkundigeSleutel']" />
<s:if
test="(#dt_boekhoudkundigeSleutel == null) ||
(#dt_boekhoudkundigeSleutel.name() == null)">
<s:set name="dtv_boekhoudkundigeSleutel" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_boekhoudkundigeSleutel"
value="#dt_boekhoudkundigeSleutel.name()" />
</s:else>
<s:if test="(#dtv_boekhoudkundigeSleutel == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_boekhoudkundigeSleutel == 'LABEL')">
<tr><td class="formTable" cssStyle="width:300px;
font-family:Tahoma;"><span class="normal">Boekhoudkundige sleutel :
</span></td><td class="formTable"> <s:iterator
value="artikelNummerDetails.boekhoudkundigeSleutel"> <s:url id="url"
action="boekhoudkundigeSleutel-detail"> <s:param
name="boekhoudkundigeSleutelOid"><s:property value="id"/></s:param>
</s:url> <s:a href="%{url}"><span class="boldText"><s:property
value="name"/></span></s:a> <br/> </s:iterator> </td></tr>
</s:elseif>
<s:elseif test="(#dtv_boekhoudkundigeSleutel == 'READONLY')">
<s:textfield id="boekhoudkundigeSleutel"
key="artikelNummerDetails.boekhoudkundigeSleutel" class="formTable"
label="Boekhoudkundige sleutel" readonly="true" />
</s:elseif>
<s:else>
<s:select multiple="true" id="boekhoudkundigeSleutel"
key="artikelNummerDetails.boekhoudkundigeSleutelIds"
list="artikelNummerAgent.boekhoudkundigeSleutelIds" listKey="id"
cssClass="multiselect2side" listValue="name" label="Boekhoudkundige sleutel"
/>
</s:else>
<s:set name="dt_status" value="displayType['status']" />
<s:if
test="(#dt_status == null) || (#dt_status.name() == null)">
<s:set name="dtv_status" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_status" value="#dt_status.name()" />
</s:else>
<s:if test="(#dtv_status == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_status == 'LABEL')">
<s:label id="status" key="artikelNummerDetails.status" class="formTable2"
label="Status" />
</s:elseif>
<s:elseif test="(#dtv_status == 'READONLY')">
<s:textfield id="status" key="artikelNummerDetails.status"
class="formTable" label="Status" readonly="true" />
</s:elseif>
<s:else>
<s:textfield name="artikelNummerDetails.status" class="formTable"
cssStyle="width:300px; font-family:Tahoma;" label="Status" />
</s:else>
<s:set name="dt_eindDatum" value="displayType['eindDatum']" />
<s:if
test="(#dt_eindDatum == null) || (#dt_eindDatum.name() == null)">
<s:set name="dtv_eindDatum" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_eindDatum" value="#dt_eindDatum.name()" />
</s:else>
<s:if test="(#dtv_eindDatum == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_eindDatum == 'LABEL')">
<s:label id="eindDatum" key="artikelNummerDetails.eindDatum"
class="formTable2" label="Eind datum" />
</s:elseif>
<s:elseif test="(#dtv_eindDatum == 'READONLY')">
<s:textfield id="eindDatum" key="artikelNummerDetails.eindDatum"
class="formTable" label="Eind datum" readonly="true" />
</s:elseif>
<s:else>
<s:textfield name="artikelNummerDetails.eindDatum" class="formTable"
cssStyle="width:300px; font-family:Tahoma;" label="Eind datum" />
</s:else>
<s:set name="dt_life" value="displayType['life']" />
<s:if
test="(#dt_life == null) || (#dt_life.name() == null)">
<s:set name="dtv_life" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_life" value="#dt_life.name()" />
</s:else>
<s:if test="(#dtv_life == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_life == 'LABEL')">
<s:label id="life" key="artikelNummerDetails.life" class="formTable2"
label="Life" />
</s:elseif>
<s:elseif test="(#dtv_life == 'READONLY')">
<s:textfield id="life" key="artikelNummerDetails.life" class="formTable"
label="Life" readonly="true" />
</s:elseif>
<s:else>
<sx:autocompleter name="artikelNummerDetails.life"
id="artikelNummerDetails.life" list="%{artikelNummerAgent.lifeList}"
keyValue="%{artikelNummerDetails.life}"
emptyOption="true" resultsLimit="-1" dropdownWidth="300"
cssStyle="width:300px; font-family:Tahoma;" label="Life" />
</s:else>
<s:set name="dt_enteredAt" value="displayType['enteredAt']" />
<s:if
test="(#dt_enteredAt == null) || (#dt_enteredAt.name() == null)">
<s:set name="dtv_enteredAt" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_enteredAt" value="#dt_enteredAt.name()" />
</s:else>
<s:if test="(#dtv_enteredAt == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_enteredAt == 'LABEL')">
<s:label id="enteredAt" key="artikelNummerDetails.enteredAt"
class="formTable2" label="Entered at" />
</s:elseif>
<s:elseif test="(#dtv_enteredAt == 'READONLY')">
<s:textfield id="enteredAt" key="artikelNummerDetails.enteredAt"
class="formTable" label="Entered at" readonly="true" />
</s:elseif>
<s:else>
<s:hidden name="artikelNummerDetails.enteredAt"
value="%{artikelNummerDetails.enteredAt}"/>
</s:else>
<s:set name="dt_enteredBy" value="displayType['enteredBy']" />
<s:if
test="(#dt_enteredBy == null) || (#dt_enteredBy.name() == null)">
<s:set name="dtv_enteredBy" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_enteredBy" value="#dt_enteredBy.name()" />
</s:else>
<s:if test="(#dtv_enteredBy == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_enteredBy == 'LABEL')">
<s:label id="enteredBy" key="artikelNummerDetails.enteredBy"
class="formTable2" label="Entered by" />
</s:elseif>
<s:elseif test="(#dtv_enteredBy == 'READONLY')">
<s:textfield id="enteredBy" key="artikelNummerDetails.enteredBy"
class="formTable" label="Entered by" readonly="true" />
</s:elseif>
<s:else>
<s:hidden name="artikelNummerDetails.enteredBy.id" value="%{
artikelNummerDetails.enteredBy.id}"/>
</s:else>
<s:set name="dt_lastModifiedAt" value="displayType['lastModifiedAt']" />
<s:if
test="(#dt_lastModifiedAt == null) || (#dt_lastModifiedAt.name() ==
null)">
<s:set name="dtv_lastModifiedAt" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_lastModifiedAt" value="#dt_lastModifiedAt.name()" />
</s:else>
<s:if test="(#dtv_lastModifiedAt == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_lastModifiedAt == 'LABEL')">
<s:label id="lastModifiedAt" key="artikelNummerDetails.lastModifiedAt"
class="formTable2" label="Last modified at" />
</s:elseif>
<s:elseif test="(#dtv_lastModifiedAt == 'READONLY')">
<s:textfield id="lastModifiedAt" key="artikelNummerDetails.lastModifiedAt"
class="formTable" label="Last modified at" readonly="true" />
</s:elseif>
<s:else>
</s:else>
<s:set name="dt_lastModifiedBy" value="displayType['lastModifiedBy']" />
<s:if
test="(#dt_lastModifiedBy == null) || (#dt_lastModifiedBy.name() ==
null)">
<s:set name="dtv_lastModifiedBy" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_lastModifiedBy" value="#dt_lastModifiedBy.name()" />
</s:else>
<s:if test="(#dtv_lastModifiedBy == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_lastModifiedBy == 'LABEL')">
<s:label id="lastModifiedBy" key="artikelNummerDetails.lastModifiedBy"
class="formTable2" label="Last modified by" />
</s:elseif>
<s:elseif test="(#dtv_lastModifiedBy == 'READONLY')">
<s:textfield id="lastModifiedBy" key="artikelNummerDetails.lastModifiedBy"
class="formTable" label="Last modified by" readonly="true" />
</s:elseif>
<s:else>
</s:else>
<s:set name="dt_dtState" value="displayType['dtState']" />
<s:if
test="(#dt_dtState == null) || (#dt_dtState.name() == null)">
<s:set name="dtv_dtState" value="'EDIT'" />
</s:if>
<s:else>
<s:set name="dtv_dtState" value="#dt_dtState.name()" />
</s:else>
<s:if test="(#dtv_dtState == 'HIDDEN')">
</s:if>
<s:elseif test="(#dtv_dtState == 'LABEL')">
<s:label id="dtState" key="artikelNummerDetails.dtState"
class="formTable2" label="Dt state" />
</s:elseif>
<s:elseif test="(#dtv_dtState == 'READONLY')">
<s:textfield id="dtState" key="artikelNummerDetails.dtState"
class="formTable" label="Dt state" readonly="true" />
</s:elseif>
<s:else>
<s:textfield name="artikelNummerDetails.dtState" class="formTable"
cssStyle="width:300px; font-family:Tahoma;" label="Dt state" />
</s:else>
<s:submit value="Submit" />
</s:form>
<jsp:include page="<%=styleVar+\"-footing.jsp\"%>" />
