<netui:form> Tag
Renders an HTML form that can be submitted to a Java method
in the Controller file for processesing.
<netui:form
action="action"
[beanName="beanName"]
[beanScope="beanScope"]
[beanType="beanType"]
[dir="dir"]
[enctype="enctype"]
[focus="focus"]
[genJavaScriptFormSubmit="genJavaScriptFormSubmit"]
[lang="lang"]
[location="location"]
[method="method"]
[onClick="onClick"]
[onDblClick="onDblClick"]
[onKeyDown="onKeyDown"]
[onKeyPress="onKeyPress"]
[onKeyUp="onKeyUp"]
[onMouseDown="onMouseDown"]
[onMouseMove="onMouseMove"]
[onMouseOut="onMouseOut"]
[onMouseOver="onMouseOver"]
[onMouseUp="onMouseUp"]
[onReset="onReset"]
[onSubmit="onSubmit"]
[style="style"]
[styleClass="styleClass"]
[tagId="tagId"]
[target="target"]
[targetScope="targetScope"]
[title="title"] />
Renders an HTML form that can be submitted to a Java method
in the Controller file for processesing.
Submitting Data
When a <netui:form> is submitted, the form data is passed to a method
for processessing. The data is passed as a Form Bean instance.
The <netui:form>'s input fields correspond to the properties of the Form Bean.
When the form is submitted the following sequence of events occurs:
(1) a new Form Bean instance is created, (2) the form data is loaded into the
corresponding Form Bean properties,
and (3) the Form Bean instance is passed to the method
where the data is processed.
The action
attribute determines the target method of the submission.
The parameter of the target method determines the Form Bean instance
that carries the submitted data.
For example, if a <netui:form>'s target method is someAction
...
<netui:form action="someAction">
//
// input fields go here
//
<netui:button value="Submit" type="submit"/>
</netui:form>
...and the someAction
method takes a Form Bean parameter of
type SomeFormBean
...
/**
* @jpf:action
* @jpf:forward name="success" path="showData.jsp"
*/
protected Forward someAction(SomeFormBean form)
...then an instance of SomeFormBean
will carry the submitted data.
Pre-populating Form Fields with the Session Object
The name
, type
, and scope
attributes can
be used together to pre-populate
the form fields with default values when they are first rendered in the browser.
In the Controller file, instantiate the appropriate Form Bean, set default values, and
store the Form Bean instance in the Session object.
protected void onCreate()
{
// Create a new Form Bean instance
ProcessDataForm formInstance = new ProcessDataForm();
// Set default values.
formInstance.setAge(32);
formInstance.setName("John");
// Store the instance in the Session object.
getSession().setAttribute("defaultValues", formInstance);
}
Then, use the name
, type
, and scope
attributes to pre-populate the
form fields.
<netui:form
action="processData"
name="defaultValues"
type="tagSamples.netui.form.FormController$ProcessDataForm"
scope="session">
Note: when the data is submitted, the data is passed as a Request-scoped Form
Bean, *not* as the Session-scoped Form Bean used to pre-populate the fields. However, you
may pass the data as a Page Flow-scoped Form Bean, if the annotation
@jpf:action form="somePageFlowScopedBean"
is set on the receiving method.
For detailed information on Form Bean scopings see
Form Bean Scopings
Pre-populating Form Fields By Passing a Form Bean Instance to the JSP Page
As an alternative to the pre-population technique above, you can set the
pre-population values in a Form Bean instance and then pass that instance to the JSP page.
For example, assume that index.jsp contains the <netui:form> and input elements.
The following action method sets the pre-population values in a Form Bean instance
and passes that instance to the
<netui:form> and its input elements.
Note that the Forward object returned by the method has two parameters, the String "success"
and the pre-populated form.
/**
* @jpf:action
* @jpf:forward name="success" path="index.jsp"
*/
protected Forward begin(ProcessDataForm form)
{
form.setAge(44);
form.setName("Mark");
return new Forward("success", form);
}
Attributes |
action |
Required: Yes | Supports
runtime evaluation: Yes | Data bindable: No |
|
Required. The action method invoked on form submit. Form data is passed to this method. |
beanName |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The attribute key under which the associated Form Bean used to populate the input form is stored.
This Form Bean is found in the scope defined by the scope attribute. |
beanScope |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The scope (request or session ) under which the associated Form Bean
used to populate the form input fields is stored.
Using the name , type and scope attributes defines
the Form Bean used. |
beanType |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The Java class name of the Form Bean to be created, if necessary.
This Form Bean will be created if the name and scope attributes are set.
The Form Bean is then used to populate the form input fields. |
dir |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The dir. |
enctype |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The content encoding to be used on a POST submit. |
focus |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The tagID of an input field which should receive initial focus. |
genJavaScriptFormSubmit |
Required: No | Supports
runtime evaluation: Yes | Data bindable: |
|
|
lang |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The lang. |
location |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The location hash to append to the URL. |
method |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The request method used when submitting this form. |
onClick |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onClick JavaScript event. |
onDblClick |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onDblClick JavaScript event. |
onKeyDown |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onKeyDown JavaScript event. |
onKeyPress |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onKeyPress JavaScript event. |
onKeyUp |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onKeyUp JavaScript event. |
onMouseDown |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onMouseDown JavaScript event. |
onMouseMove |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onMouseMove JavaScript event. |
onMouseOut |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onMouseOut JavaScript event. |
onMouseOver |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onMouseOver JavaScript event. |
onMouseUp |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The onMouseUp JavaScript event. |
onReset |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The JavaScript onReset event. |
onSubmit |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The JavaScript onSubmit event. |
style |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The style. |
styleClass |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The style class. |
tagId |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
String value. Sets the id (or name ) attribute of the rendered HTML tag.
Note that the real id attribute rendered in the browser may be
changed by the application container (for example, Portal containers may change
the rendered id value to ensure the uniqueness of
id's on the page). In this case, the real id rendered
in the browser may be looked up
through the JavaScript function getNetuiTagName( tagId, tag ).
For example, assume that some tag's tagId attribute is set to foo .
<netui:textBox tagId="foo" />
Then the following JavaScript function will return the real id attribute rendered in the browser:
getNetuiTagName( "foo", this )
To get a <netui:form> element and all of its children elements in JavaScript, use
the same JavaScript function getNetuiTagName( tagId, tag ) . For example,
assume that there is a <netui:form> whose
tagId attribute is set to bar .
<netui:form tagId="bar" >
Then the following JavaScript function will return the <netui:form> element
and its children (packaged as an array).
document[getNetuiTagName( "bar", this )]
To retreive the value entered into a <netui:textBox> within the <netui:form> tag, use the following
JavaScript expression.
document[getNetuiTagName("bar", this)][getNetuiTagName("foo", this)].value
The second parameter ensures that the JavaScript function
begins its search within the correct Portlet scope. Pass the
JavaScript keyword this as the second parameter.
For detailed information on using the function
getNetuiTagName( tagId, tag ) see
Using JavaScript in Page Flow and Portal Applications. |
target |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The window target |
targetScope |
Required: No | Supports
runtime evaluation: Yes | Data bindable: Yes |
|
The target scope in which the associated action's page flow resides. |
title |
Required: No | Supports
runtime evaluation: Yes | Data bindable: No |
|
The title. |
In this first sample, the
<netui:form> tag invokes the processData
action method in the Controller file when the form is submitted.
<netui:form action="processData">
Name:
<netui:textBox dataSource="{actionForm.name}"/>
Age:
<netui:textBox dataSource="{actionForm.age}"/>
<netui:button value="Submit" type="submit"/>
</netui:form>
Notice that the processData action method takes a parameter of
type ProcessDataForm
.
/**
* @jpf:action
* @jpf:forward name="success" path="showData.jsp"
*/
protected Forward processData(ProcessDataForm form)
{
//
// Process the submitted data here.
//
return new Forward("success");
}
This means that the submitted data is loaded into an
instance of ProcessDataForm before
it is passed to the action method.
In this next sample, the form fields are pre-populated based upon default values
stored in the Session object.
<netui:form action="Action" type="corp.Controller$NameBean"
scope="session" name="nameBean">
Name: <netui:textBox dataSource="{actionForm.name}" />
<netui:button value="Submit"/>
</netui:form>