Page History

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^{Image Removed}.) 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.

<s:select key="personBean.sport" list="sports" />

In these form tags, we are using the key attribute as discussed in the Message Resource Files tutorial. The key attribute is used by the Struts 2 framework to determine values for the other attributes (e.g. label and value). We are also using a property file associated with the EditAction class to provide the label values based on the key attribute value (see the Message Resource FileFiles tutorial for information on using Struts 2 property files).

...

The Struts 2 framework determines which option is preselected by using the key attribute's value to call a method on the personBean object. Since the key attribute's value is "personBean.sportssport", the framework calls the personBean object's getSports getSport method. If the value returned by that method matches one of the option values, that option will be marked as "selected".

Here is the HTML that results from using the above Struts 2 select tag.

<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.

<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.

<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

<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.

<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.

<s:checkbox key="personBean.over21" />

Since the method getOver21 returns true, the checkbox is checked.

<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.

<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.

<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>

Summary
There are several other Struts 2 form controls you should explore. If you need more information about the Struts 2 form tags consult the Struts 2 documentation at http://struts.apache.org.

Up Next

In our next tutorial we'll cover how to use XML to validate a user's form field entries.