Info |
---|
The example code for this tutorial, Form_Tags_Struts2_Ant or Form_Tags_Struts2_Mvn, is available on Google Code - httpform_tags, can be checked out from https://codegithub.google.com/papache/struts2-examples/downloads/list |
Introduction
In this tutorial we'll explore some of the other Struts 2 form controls. In our previous tutorials that explained how to use Struts 2 forms (Processing Forms, Form Validation, and Message Resource Files) we covered how to use the Struts 2 head, form, textfield controls and the key attribute. This tutorial will explore using the Struts 2 select, radio, checkbox, and checkboxlist form controls.
...
The example application that supports this tutorial (Form_Tags_Struts2 available at http://code.google.com/p/struts2-examples/downloads/list.) shows how to use Struts 2 form tags so that a user can edit his information. The information that can be edited is encapsulated in an object of class Person. A Person object knows these things: first name, last name, favorite sport, gender, state of residency, is or is not over 21, and car models owned.
...
A user can select one favorite sport from several choices. The example application uses the Struts 2 select tag to provide the list of options for the select box.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<s:select key="personBean.sport" list="sports" />
|
...
Here is the HTML that results from using the above Struts 2 select tag.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<tr>
<td class="tdLabel">
<label for="save_personBean_sport" class="label">Favorite sport:</label>
</td>
<td>
<select name="personBean.sport" id="save_personBean_sport">
<option value="football">football</option>
<option value="baseball">baseball</option>
<option value="basketball" selected="selected">basketball</option>
</select>
</td>
</tr>
|
...
The Struts 2 radio tag—like its standard HTML counterpart—is used to display 2 or more choices, only one of which can be selected by the user. Here is the code for the Struts 2 radio button from the example application.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<s:radio key="personBean.gender" list="genders" />
|
Again the key attribute's value determines the value for the label and value attributes. The label's text is derived from the EditAction.properties file (key personBean.gender). Just like the Struts 2 select tag, the list attribute of the Struts 2 radio tag causes the framework to call the getGenders method of the EditAction class. The Array of String objects returned are used to create the individual radio buttons.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<tr>
<td class="tdLabel">
<label for="save_personBean_gender" class="label">Gender:</label></td>
<td>
<input type="radio" name="personBean.gender" id="save_personBean_gendermale" value="male"/><label for="save_personBean_gendermale">male</label>
<input type="radio" name="personBean.gender" id="save_personBean_genderfemale" value="female"/><label for="save_personBean_genderfemale">female</label>
<input type="radio" name="personBean.gender" id="save_personBean_gendernot sure" checked="checked" value="not sure"/><label for="save_personBean_gendernot sure">not sure</label>
</td>
</tr>
|
...
You may need to create a Struts 2 select tag where the options displayed to the user each have their own value that is different then what is displayed. In the example application, the user's residency is stored as a two-letter abbreviation (e.g. KS), but the form select box should display the full state name (e.g. Kansas). To create such a select box in Struts 2, you would use this code
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<s:select key="personBean.residency" list="states" listKey="stateAbbr" listValue="stateName" />
|
...
The listKey attribute tells the framework to use the value returned by calling the getStateAbbr method as the value for the value attribute of the HTML option tag and the value returned by calling the getStateName method as the value displayed to the user. So the above Struts 2 select tag code results in this HTML.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<tr>
<td class="tdLabel">
<label for="save_personBean_residency" class="label">State resident:</label></td>
<td>
<select name="personBean.residency" id="save_personBean_residency">
<option value="AZ">Arizona</option>
<option value="CA">California</option>
<option value="FL">Florida</option>
<option value="KS" selected="selected">Kansas</option>
<option value="NY">New York</option>
</select>
</td>
</tr>
|
...
The Struts 2 checkbox tag is used to create the HTML input type equals checkbox tag. The value for the key attribute tells the framework what method to call to determine if the checkbox is checked or not checked. The method called should return a Boolean value (true or false). A return value of true will cause the checkbox to be checked and false the checkbox will not be checked.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<s:checkbox key="personBean.over21" />
|
Since the method getOver21 returns true, the checkbox is checked.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<tr>
<td valign="top" align="right">
</td>
<td valign="top" align="left">
<input type="checkbox" name="personBean.over21" value="true" checked="checked" id="save_personBean_over21"/>
<input type="hidden" id="__checkbox_save_personBean_over21" name="__checkbox_personBean.over21" value="true" /> <label for="save_personBean_over21" class="checkboxLabel">21 or older</label>
</td>
</tr>
|
...
Using the Struts 2 checkbox tag, we can create a series of checkboxes, one for each possible car model the user may own. The value of each String in the personBean's carModels Array will determine which checkboxes are checked.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<s:checkboxlist key="personBean.carModels" list="carModelsAvailable" />
|
...
The key attribute value in the checkboxlist tag tells the Struts 2 framework which method to call on the personBean object to determine which checkboxes should be checked. In the example application, the framework will call the personBean object's getCarModels method. The getCarModels method returns an Array of Strings. For each String value in that Array that matches a String value in the Array returned by the EditAction class's getCarModelsAvailable, the checkbox will be checked.
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<tr>
<td class="tdLabel">
<label for="save_personBean_carModels" class="label">Car models owned:</label></td>
<td>
<input type="checkbox" name="personBean.carModels" value="Ford" id="personBean.carModels-1" checked="checked"/>
<label for="personBean.carModels-1" class="checkboxLabel">Ford</label>
<input type="checkbox" name="personBean.carModels" value="Chrysler" id="personBean.carModels-2"/>
<label for="personBean.carModels-2" class="checkboxLabel">Chrysler</label>
<input type="checkbox" name="personBean.carModels" value="Toyota" id="personBean.carModels-3"/>
<label for="personBean.carModels-3" class="checkboxLabel">Toyota</label>
<input type="checkbox" name="personBean.carModels" value="Nissan" id="personBean.carModels-4" checked="checked"/>
<label for="personBean.carModels-4" class="checkboxLabel">Nissan</label>
<input type="hidden" id="__multiselect_save_personBean_carModels" name="__multiselect_personBean.carModels" value="" />
</td>
</tr>
|
...
In our next tutorial we'll cover how to use additional Struts 2 form tagsXML to validate a user's form field entries.
Next | Onward to Form Validation Using XML |
---|---|
Prev | Return to Debugging Struts |