Google Git
Sign in
apache / struts-site / refs/heads/asf-site / . / output / tag-developers / form-tags.html
blob: 17d470a99c37457620b47e32afff742e9450a96a [file] [log] [blame]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="Date-Revision-yyyymmdd" content="20140918"/>
<meta http-equiv="Content-Language" content="en"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Tag Developers Guide</title>
<link href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,400italic,600italic,700italic" rel="stylesheet" type="text/css">
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
<link href="/css/main.css" rel="stylesheet">
<link href="/css/custom.css" rel="stylesheet">
<link href="/css/syntax.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="/bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="/js/community.js"></script>
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
/* We explicitly disable cookie tracking to avoid privacy issues */
_paq.push(['disableCookies']);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//analytics.apache.org/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '41']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</head>
<body>
<a href="https://github.com/apache/struts" class="github-ribbon">
<img decoding="async" loading="lazy" style="position: absolute; right: 0; border: 0;" width="149" height="149" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_red_aa0000.png?resize=149%2C149" class="attachment-full size-full" alt="Fork me on GitHub" data-recalc-dims="1">
</a>
<header>
<nav>
<div role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" data-toggle="collapse" data-target="#struts-menu" class="navbar-toggle">
Menu
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="/index.html" class="navbar-brand logo"><img src="/img/struts-logo.svg"></a>
</div>
<div id="struts-menu" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle">
Home<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="/index.html">Welcome</a></li>
<li><a href="/download.cgi">Download</a></li>
<li><a href="/releases.html">Releases</a></li>
<li><a href="/announce-2024.html">Announcements</a></li>
<li><a href="http://www.apache.org/licenses/">License</a></li>
<li><a href="https://www.apache.org/foundation/thanks.html">Thanks!</a></li>
<li><a href="https://www.apache.org/foundation/sponsorship.html">Sponsorship</a></li>
<li><a href="https://privacy.apache.org/policies/privacy-policy-public.html">Privacy Policy</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle">
Support<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="/mail.html">User Mailing List</a></li>
<li><a href="https://issues.apache.org/jira/browse/WW">Issue Tracker</a></li>
<li><a href="/security.html">Reporting Security Issues</a></li>
<li><a href="/commercial-support.html">Commercial Support</a></li>
<li class="divider"></li>
<li><a href="https://cwiki.apache.org/confluence/display/WW/Migration+Guide">Version Notes</a></li>
<li><a href="https://cwiki.apache.org/confluence/display/WW/Security+Bulletins">Security Bulletins</a></li>
<li class="divider"></li>
<li><a href="/maven/project-info.html">Maven Project Info</a></li>
<li><a href="/maven/struts2-core/dependencies.html">Struts Core Dependencies</a></li>
<li><a href="/maven/struts2-plugins/modules.html">Plugin Dependencies</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle">
Documentation<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="/birdseye.html">Birds Eye</a></li>
<li><a href="/primer.html">Key Technologies</a></li>
<li><a href="/kickstart.html">Kickstart FAQ</a></li>
<li><a href="https://cwiki.apache.org/confluence/display/WW/Home">Wiki</a></li>
<li class="divider"></li>
<li><a href="/getting-started/">Getting Started</a></li>
<li><a href="/security/">Security Guide</a></li>
<li><a href="/core-developers/">Core Developers Guide</a></li>
<li><a href="/tag-developers/">Tag Developers Guide</a></li>
<li><a href="/maven-archetypes/">Maven Archetypes</a></li>
<li><a href="/plugins/">Plugins</a></li>
<li><a href="/maven/struts2-core/apidocs/index.html">Struts Core API</a></li>
<li><a href="/tag-developers/tag-reference.html">Tag reference</a></li>
<li><a href="https://cwiki.apache.org/confluence/display/WW/FAQs">FAQs</a></li>
<li><a href="http://cwiki.apache.org/S2PLUGINS/home.html">Plugin registry</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle">
Contributing<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="/youatstruts.html">You at Struts</a></li>
<li><a href="/helping.html">How to Help FAQ</a></li>
<li><a href="/dev-mail.html">Development Lists</a></li>
<li class="divider"></li>
<li><a href="/submitting-patches.html">Submitting patches</a></li>
<li><a href="/builds.html">Source Code and Builds</a></li>
<li><a href="/coding-standards.html">Coding standards</a></li>
<li><a href="/contributors/">Contributors Guide</a></li>
<li class="divider"></li>
<li><a href="/release-guidelines.html">Release Guidelines</a></li>
<li><a href="/bylaws.html">PMC Charter</a></li>
<li><a href="/volunteers.html">Volunteers</a></li>
<li><a href="https://gitbox.apache.org/repos/asf?p=struts.git">Source Repository</a></li>
<li><a href="/updating-website.html">Updating the website</a></li>
</ul>
</li>
<li class="apache"><a href="http://www.apache.org/"><img src="/img/apache.png"></a></li>
</ul>
</div>
</div>
</div>
</nav>
</header>
<article class="container">
<section class="col-md-12">
<a class="edit-on-gh" href="https://github.com/apache/struts-site/edit/master/source/tag-developers/form-tags.md" title="Edit this page on GitHub">Edit on GitHub</a>
<h1 class="no_toc" id="form-tags">Form Tags</h1>
<ul id="markdown-toc">
<li><a href="#form-tag-themes" id="markdown-toc-form-tag-themes">Form Tag Themes</a></li>
<li><a href="#simple-theme-caveats" id="markdown-toc-simple-theme-caveats">Simple theme caveats</a></li>
<li><a href="#common-attributes" id="markdown-toc-common-attributes">Common Attributes</a></li>
<li><a href="#template-related-attributes" id="markdown-toc-template-related-attributes">Template-Related Attributes</a></li>
<li><a href="#javascript-related-attributes" id="markdown-toc-javascript-related-attributes">Javascript-Related Attributes</a></li>
<li><a href="#tooltip-related-attributes" id="markdown-toc-tooltip-related-attributes">Tooltip Related Attributes</a></li>
<li><a href="#general-attributes" id="markdown-toc-general-attributes">General Attributes</a></li>
<li><a href="#valuename-relationship" id="markdown-toc-valuename-relationship">Value/Name Relationship</a></li>
<li><a href="#id-name-assignment" id="markdown-toc-id-name-assignment">ID Name Assignment</a></li>
<li><a href="#form-labelposition-propagation" id="markdown-toc-form-labelposition-propagation">Form labelposition propagation</a></li>
<li><a href="#required-attribute" id="markdown-toc-required-attribute">Required Attribute</a></li>
<li><a href="#tooltip" id="markdown-toc-tooltip">Tooltip</a></li>
</ul>
<p>Please make sure you have read the <a href="tag-syntax">Tag Syntax</a> document and understand how tag attribute syntax works.</p>
<p>Within the form tags, there are two classes of tags: the form tag itself, and all other tags, which make up
the individual form elements. The behavior of the form tag is different from the elements enclosed within it.</p>
<h2 id="form-tag-themes">Form Tag Themes</h2>
<p>As explained in <a href="themes-and-templates">Themes and Templates</a>, the HTML Tags (which includes Form Tags) are all driven
by templates. Templates are grouped together to create themes. The framework bundles three themes in the distribution.</p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>simple</td>
<td>Sometimes <em>too</em> simple</td>
<td> </td>
</tr>
<tr>
<td>xhtml</td>
<td>Extends simple, layout base on <code class="language-plaintext highlighter-rouge">&lt;table&gt;</code>s</td>
<td>(default)</td>
</tr>
<tr>
<td>css_xhtml</td>
<td>Extends simple, layout base on <code class="language-plaintext highlighter-rouge">&lt;div&gt;</code>s and CSS</td>
<td> </td>
</tr>
</tbody>
</table>
<p>The predefined themes can be used “as is” or customized.</p>
<blockquote>
<p>The <code class="language-plaintext highlighter-rouge">xhtml</code> theme renders out a two-column table. If a different layout is needed, do <em>not</em> write your own HTML.
Create a new theme or utilize the simple theme.</p>
</blockquote>
<h2 id="simple-theme-caveats">Simple theme caveats</h2>
<p>The downside of using the simple theme is that it doesn’t support as many of the attributes that the other themes do.
For example, the <code class="language-plaintext highlighter-rouge">label</code> attribute does nothing in the simple theme, and the automatic display of error messages
is not supported.</p>
<h2 id="common-attributes">Common Attributes</h2>
<p>All the form tags extend the UIBean class. This base class provides a set of common attributes, that can be grouped
in to three categories: <em>templated-related</em>, <em>javascript-related</em>, and <em>general</em> attributes. The individual attributes
are documented on each tag’s reference page.</p>
<p>In addition to the common attributes, a special attribute exists for all form element tags: <code class="language-plaintext highlighter-rouge">form</code> (<code class="language-plaintext highlighter-rouge">${parameters.form}</code>).
The <code class="language-plaintext highlighter-rouge">form</code> property represents the attributes used to render the form tag, such as the form’s id. In a template,
the form’s ID can be found by calling <code class="language-plaintext highlighter-rouge">${parameters.form.id}</code>.</p>
<h2 id="template-related-attributes">Template-Related Attributes</h2>
<table>
<thead>
<tr>
<th>Attribute</th>
<th>Theme</th>
<th>Data Types</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>templateDir</td>
<td>n/a</td>
<td>String</td>
<td>define the template directory</td>
</tr>
<tr>
<td>theme</td>
<td>n/a</td>
<td>String</td>
<td>define the theme name</td>
</tr>
<tr>
<td>template</td>
<td>n/a</td>
<td>String</td>
<td>define the template name</td>
</tr>
<tr>
<td>themeExpansionToken</td>
<td>n/a</td>
<td>String</td>
<td>special token (defined with struts.ui.theme.expansion.token) used to search for template in parent theme</td>
</tr>
<tr>
<td>(don’t use it separately!)</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>expandTheme</td>
<td>n/a</td>
<td>String</td>
<td>concatenation of themeExpansionToken and theme which tells internal template loader mechanism to try load template from current theme and then from parent theme (and parent theme, and so on) when used with &lt;#include/&gt; directive</td>
</tr>
</tbody>
</table>
<h2 id="javascript-related-attributes">Javascript-Related Attributes</h2>
<table>
<thead>
<tr>
<th>Attribute</th>
<th>Theme</th>
<th>Data Types</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>onclick</td>
<td>simple</td>
<td>String</td>
<td>html javascript onclick attribute</td>
</tr>
<tr>
<td>ondblclick</td>
<td>simple</td>
<td>String</td>
<td>html javascript ondbclick attribute</td>
</tr>
<tr>
<td>onmousedown</td>
<td>simple</td>
<td>String</td>
<td>html javascript onmousedown attribute</td>
</tr>
<tr>
<td>onmouseup</td>
<td>simple</td>
<td>String</td>
<td>html javascript onmouseup attribute</td>
</tr>
<tr>
<td>onmouseover</td>
<td>simple</td>
<td>String</td>
<td>html javascript onmouseover attribute</td>
</tr>
<tr>
<td>onmouseout</td>
<td>simple</td>
<td>String</td>
<td>html javascript onmouseout attribute</td>
</tr>
<tr>
<td>onfocus</td>
<td>simple</td>
<td>String</td>
<td>html javascript onfocus attribute</td>
</tr>
<tr>
<td>onblur</td>
<td>simple</td>
<td>String</td>
<td>html javascript onblur attribute</td>
</tr>
<tr>
<td>onkeypress</td>
<td>simple</td>
<td>String</td>
<td>html javascript onkeypress attribute</td>
</tr>
<tr>
<td>onkeyup</td>
<td>simple</td>
<td>String</td>
<td>html javascript onkeyup attribute</td>
</tr>
<tr>
<td>onkeydown</td>
<td>simple</td>
<td>String</td>
<td>html javascript onkeydown attribute</td>
</tr>
<tr>
<td>onselect</td>
<td>simple</td>
<td>String</td>
<td>html javascript onselect attribute</td>
</tr>
<tr>
<td>onchange</td>
<td>simple</td>
<td>String</td>
<td>html javascript onchange attribute</td>
</tr>
</tbody>
</table>
<h2 id="tooltip-related-attributes">Tooltip Related Attributes</h2>
<table>
<thead>
<tr>
<th>Attribute</th>
<th>Data Type</th>
<th>Default</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>tooltip</td>
<td>String</td>
<td>none</td>
<td>Set the tooltip of this particular component</td>
</tr>
<tr>
<td>jsTooltipEnabled</td>
<td>String</td>
<td>false</td>
<td>Enable js tooltip rendering</td>
</tr>
<tr>
<td>tooltipIcon</td>
<td>String</td>
<td>/struts/static/tooltip/tooltip.gif</td>
<td>The url to the tooltip icon</td>
</tr>
<tr>
<td>tooltipDelay</td>
<td>String</td>
<td>500</td>
<td>Tooltip shows up after the specified timeout (milliseconds). A behavior similar to that of OS based tooltips.</td>
</tr>
<tr>
<td>key</td>
<td>simple</td>
<td>String</td>
<td>The name of the property this input field represents. This will auto populate the name, label, and value</td>
</tr>
</tbody>
</table>
<h2 id="general-attributes">General Attributes</h2>
<table>
<thead>
<tr>
<th>Attribute</th>
<th>Theme</th>
<th>Data Types</th>
<th>Description</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>cssClass</td>
<td>simple</td>
<td>String</td>
<td>define html class attribute</td>
<td> </td>
</tr>
<tr>
<td>cssStyle</td>
<td>simple</td>
<td>String</td>
<td>define html style attribute</td>
<td> </td>
</tr>
<tr>
<td>cssErrorClass</td>
<td>simple</td>
<td>String</td>
<td>error class attribute</td>
<td> </td>
</tr>
<tr>
<td>cssErrorStyle</td>
<td>simple</td>
<td>String</td>
<td>error style attribute</td>
<td> </td>
</tr>
<tr>
<td>title</td>
<td>simple</td>
<td>String</td>
<td>define html title attribute</td>
<td> </td>
</tr>
<tr>
<td>disabled</td>
<td>simple</td>
<td>String</td>
<td>define html disabled attribute</td>
<td> </td>
</tr>
<tr>
<td>label</td>
<td>xhtml</td>
<td>String</td>
<td>define label of form element</td>
<td> </td>
</tr>
<tr>
<td>labelPosition</td>
<td>xhtml</td>
<td>String</td>
<td>define label position of form element (top/left), default to left</td>
<td> </td>
</tr>
<tr>
<td>requiredPosition</td>
<td>xhtml</td>
<td>String</td>
<td>define required label position of form element (left/right), default to right</td>
<td> </td>
</tr>
<tr>
<td>errorPosition</td>
<td>xhtml</td>
<td>String</td>
<td>define error position of form element (top</td>
<td>bottom), default to top</td>
</tr>
<tr>
<td>name</td>
<td>simple</td>
<td>String</td>
<td>Form Element’s field name mapping</td>
<td> </td>
</tr>
<tr>
<td>requiredLabel</td>
<td>xhtml</td>
<td>Boolean</td>
<td>add * to label (true to add false otherwise)</td>
<td> </td>
</tr>
<tr>
<td>tabIndex</td>
<td>simple</td>
<td>String</td>
<td>define html tabindex attribute</td>
<td> </td>
</tr>
<tr>
<td>value</td>
<td>simple</td>
<td>Object</td>
<td>define value of form element</td>
<td> </td>
</tr>
</tbody>
</table>
<blockquote>
<p>Some tag attributes may not be utilized by all, or any, of the templates. For example, the form tag supports
the tabindex attribute, but none of the themes render the tabindex.</p>
</blockquote>
<h2 id="valuename-relationship">Value/Name Relationship</h2>
<p>In many of the tags (except for the form tag) there is a unique relationship between the <code class="language-plaintext highlighter-rouge">name</code> and <code class="language-plaintext highlighter-rouge">value</code> attributes.
The <code class="language-plaintext highlighter-rouge">name</code> attribute provides the name for the tag, which in turn is used as the control attribute when the form
is submitted. The value submitted is bound to the <code class="language-plaintext highlighter-rouge">name</code>. In most cases, the <code class="language-plaintext highlighter-rouge">name</code> maps to a simple JavaBean property,
such as “postalCode”. On submit, the value would be set to the property by calling the <code class="language-plaintext highlighter-rouge">setPostalCode</code> mutator.</p>
<p>Likewise, a form control could be populated by calling a JavaBean accessor, like <code class="language-plaintext highlighter-rouge">getPostalCode</code>. In the expression
language, we can refer to the JavaBean property by name. An expression like “%{postalCode}” would in turn call <code class="language-plaintext highlighter-rouge">getPostalCode</code>.</p>
<div class="language-ftl highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="err">&lt;@</span><span class="no">s</span><span class="na">.form</span><span class="w"> </span>action="updateAddress"&gt;<span class="w">
</span>&lt;@s.textfield label="Postal Code" name="postalCode" value="%<span class="p">{</span><span class="no">postalCode</span><span class="p">}</span>"/&gt;<span class="w">
</span><span class="err"> ...</span><span class="w">
</span><span class="err">&lt;/@</span><span class="no">s</span><span class="na">.form</span><span class="err">&gt;</span><span class="w">
</span></code></pre></div></div>
<p>However, since the tags imply a relationship between the <code class="language-plaintext highlighter-rouge">name</code> and <code class="language-plaintext highlighter-rouge">value</code>, the <code class="language-plaintext highlighter-rouge">value</code> attribute is optional.
If a <code class="language-plaintext highlighter-rouge">value</code> is not specified, by default, the JavaBean accessor is used instead.</p>
<div class="language-ftl highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="err">&lt;@</span><span class="no">s</span><span class="na">.form</span><span class="w"> </span>action="updateAddress"&gt;<span class="w">
</span>&lt;@s.textfield label="Postal Code" name="postalCode"/&gt;<span class="w">
</span><span class="err"> ...</span><span class="w">
</span><span class="err">&lt;/@</span><span class="no">s</span><span class="na">.form</span><span class="err">&gt;</span><span class="w">
</span></code></pre></div></div>
<p>While most attributes are exposed to the underlying templates as the same key as the attribute (<code class="language-plaintext highlighter-rouge">${parameters.label}</code>),
the <code class="language-plaintext highlighter-rouge">value</code> attribute is not. Instead, it can be accessed via the <code class="language-plaintext highlighter-rouge">nameValue</code> key (<code class="language-plaintext highlighter-rouge">${parameters.nameValue}</code>).
The <code class="language-plaintext highlighter-rouge">nameValue</code> key indicates that the value may have been generated from the <code class="language-plaintext highlighter-rouge">name</code> attribute rather than explicitly
defined in the <code class="language-plaintext highlighter-rouge">value</code> attribute.</p>
<h2 id="id-name-assignment">ID Name Assignment</h2>
<p>All form tags automatically assign an ID to the control, but the ID can be overridden if needed.</p>
<table>
<thead>
<tr>
<th>Forms</th>
<th>The default ID is the action name. For example, “updateAddress”.</th>
</tr>
</thead>
<tbody>
<tr>
<td>Controls</td>
<td>The default ID is the form’s name concatenated with the tag name. For example, “updateAddress_postalCode”.</td>
</tr>
</tbody>
</table>
<h2 id="form-labelposition-propagation">Form labelposition propagation</h2>
<p>When <code class="language-plaintext highlighter-rouge">labelposition</code> attribute was defined for <code class="language-plaintext highlighter-rouge">&lt;s:form&gt;</code> tag it will be propagated to all form elements, but if form
element defines its own <code class="language-plaintext highlighter-rouge">labelposition</code> it will take precedence over <code class="language-plaintext highlighter-rouge">&lt;s:form&gt;</code>’s attribute. Since 2.3.17.</p>
<h2 id="required-attribute">Required Attribute</h2>
<p>The <code class="language-plaintext highlighter-rouge">required</code> attribute on many UI tags defaults to true only if you have client-side validation enabled,
and a validator is associated with that particular field.</p>
<h2 id="tooltip">Tooltip</h2>
<blockquote>
<p><strong>NOTE</strong>: tooltipConfig is deprecated, use individual tooltip configuration attributes instead</p>
</blockquote>
<p>Every Form UI component (in <code class="language-plaintext highlighter-rouge">xhtml</code> / <code class="language-plaintext highlighter-rouge">css_xhtml</code> or any other which extends them) can have tooltips assigned to them.
The Form component’s tooltip related attribute, once defined, will be applied to all form UI components that are created
under it unless explicitly overridden by having the Form UI component itself defined with their own tooltip attribute.</p>
<p>In Example 1, the textfield will inherit the tooltipDelay and tooltipIconPath attribute from its containing form.
In other words, although it doesn’t define a tooltipIconPath attribute, it will have that attribute inherited from its
containing form.</p>
<p>In Example 2, the textfield will inherit both the tooltipDelay and tooltipIconPath attribute from its containing form,
but the tooltipDelay attribute is overridden at the textfield itself. Hence, the textfield actually will have its
tooltipIcon defined as /myImages/myIcon.gif, inherited from its containing form, and tooltipDelay defined as 5000.</p>
<p>Example 3, 4 and 5 show different ways of setting the tooltip configuration attribute.</p>
<ul>
<li>Example 3: Set tooltip config through the body of the param tag</li>
<li>Example 4: Set tooltip config through the value attribute of the param tag</li>
<li>Example 5: Set tooltip config through the tooltip attributes of the component tag</li>
</ul>
<div class="language-jsp highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c">&lt;!-- Example 1: --&gt;</span>
<span class="nt">&lt;s:form
</span><span class="na">tooltipDelay=</span><span class="s">"500"</span><span class="na">
tooltipIconPath=</span><span class="s">"/myImages/myIcon.gif"</span> .... <span class="nt">&gt;</span>
....
<span class="nt">&lt;s:textfield </span><span class="na">label=</span><span class="s">"Customer Name"</span><span class="na"> tooltip=</span><span class="s">"Enter the customer name"</span> .... <span class="nt">/&gt;</span>
....
<span class="nt">&lt;/s:form&gt;</span>
<span class="c">&lt;!-- Example 2: --&gt;</span>
<span class="nt">&lt;s:form
</span><span class="na">tooltipDelay=</span><span class="s">"500"</span><span class="na">
tooltipIconPath=</span><span class="s">"/myImages/myIcon.gif"</span> .... <span class="nt">&gt;</span>
....
<span class="nt">&lt;s:textfield </span><span class="na">label=</span><span class="s">"Address"</span><span class="na">
tooltip=</span><span class="s">"Enter your address"</span><span class="na">
tooltipDelay=</span><span class="s">"5000"</span> <span class="nt">/&gt;</span>
....
<span class="nt">&lt;/s:form&gt;</span>
<span class="nt">&lt;--</span> <span class="na">Example</span> <span class="err">3</span><span class="na">:</span> <span class="na">--</span><span class="nt">&gt;</span>
<span class="nt">&lt;s:textfield
</span><span class="na">label=</span><span class="s">"Customer Name"</span><span class="na">
tooltip=</span><span class="s">"One of our customer Details"</span><span class="nt">&gt;</span>
<span class="nt">&lt;s:param </span><span class="na">name=</span><span class="s">"tooltipDelay"</span><span class="nt">&gt;</span>
500
<span class="nt">&lt;/s:param&gt;</span>
<span class="nt">&lt;s:param </span><span class="na">name=</span><span class="s">"tooltipIconPath"</span><span class="nt">&gt;</span>
/myImages/myIcon.gif
<span class="nt">&lt;/s:param&gt;</span>
<span class="nt">&lt;/s:textfield&gt;</span>
<span class="nt">&lt;--</span> <span class="na">Example</span> <span class="err">4</span><span class="na">:</span> <span class="na">--</span><span class="nt">&gt;</span>
<span class="nt">&lt;s:textfield
</span><span class="na">label=</span><span class="s">"Customer Address"</span><span class="na">
tooltip=</span><span class="s">"Enter The Customer Address"</span> <span class="nt">&gt;</span>
<span class="nt">&lt;s:param
</span><span class="na">name=</span><span class="s">"tooltipDelay"</span><span class="na">
value=</span><span class="s">"500"</span> <span class="nt">/&gt;</span>
<span class="nt">&lt;/s:textfield&gt;</span>
<span class="nt">&lt;--</span> <span class="na">Example</span> <span class="err">5</span><span class="na">:</span> <span class="na">--</span><span class="nt">&gt;</span>
<span class="nt">&lt;s:textfield
</span><span class="na">label=</span><span class="s">"Customer Telephone Number"</span><span class="na">
tooltip=</span><span class="s">"Enter customer Telephone Number"</span><span class="na">
tooltipDelay=</span><span class="s">"500"</span><span class="na">
tooltipIconPath=</span><span class="s">"/myImages/myIcon.gif"</span> <span class="nt">/&gt;</span>
</code></pre></div></div>
</section>
</article>
<footer class="container">
<div class="col-md-12">
Copyright &copy; 2000-2022 <a href="https://www.apache.org/">The Apache Software Foundation</a>.
Apache Struts, Struts, Apache, the Apache feather logo, and the Apache Struts project logos are
trademarks of The Apache Software Foundation. All Rights Reserved.
</div>
<div class="col-md-12">Logo and website design donated by <a href="https://softwaremill.com/">SoftwareMill</a>.</div>
</footer>
<script>!function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = "//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");</script>
<script src="https://apis.google.com/js/platform.js" async="async" defer="defer"></script>
<div id="fb-root"></div>
<script>(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
</body>
</html>