20. Implementing an HTML Form in JSP using Spring Form Tag Library

PROBLEM

Spring MVC provides a JSP tag library (Spring Form) for making it easier to bind form elements to Model data. Skyway Builder's tag library extends the Spring Form tag library, but there may be occasions that the UI developer prefers to use the Spring Form tag library directly or needs to access server-side functionality generated by Skyway Builder from pre-existing JSP pages implemented with the Spring Form library.

SOLUTION

Skyway Builder supports the use of the Spring Form tag library for implementing JSP-based user interfaces.

HOW IT WORKS

In order to use the Spring Form tag library, standard JSP tag library conventions apply. You will need to add the following JSP directive to the JSP page that will use the Spring Form tag libary.

Example 2.18. JSP Directive for using Spring Form Tag Library

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>     

The Spring Form tag library can then be used to implement the user interface. The following HTML fragment shows how you can implement an HTML form using the Spring Form tag library.

Example 2.19. HTML Form using Spring Form Tag Library

<!-- The labels and ids have been omitted for brevity.  -->
<form:form commandName="MyModel"1
           name="myForm" 
           action="${pageContext.request.contextPath}/MyController/saveModel.action"2
           method="post">
   <form:input path="name"/>3
   <form:textarea path="description" rows="3" cols="20" />
   <form:checkbox path="validated" value="Magic"/>
   <form:select path="country">
      <form:option value="-" label="--Select Country"/>
      <form:options items="${countries}"/>4
   </form:select>
   <form:radiobuttons path="color" items="${colors}" />5

   <input type="submit" value="OK" />6
</form:form>

1

The commandName attribute is configured with the name of the Model that contains the variables that will be set by this form. In this example the Controller contains a model called "MyModel".

2

The action attribute is configured with the URL that will handle the form submission. The URL should be a configured URL mapping with the "Bind Request Values" enabled.

3

The Spring Form path attribute is configured with the model variable that form element will be bound to.

4

In order to populate a dropdown with a list of items stored in variable, the items attribute should be configured with a Model variable. The variable can be a list, map, or collection of objects.

5

Populating radio button options is very similar to dropdown options. For the items attribute you can use a list, map, or collection of objects.

6

A standard html submit button will submit the form to the specified action.

The user interface in Skyway applications is implemented using JSP, which offers a lot of inherent functionality to help web developers build web applications. In addition to using the Spring Form tag library, standard JSP functionality (i.e. JSTL) is fully leveragable for Skyway applications

Note

While the Spring tag library is the easiest way to bind form controls to Spring command objects, the <spring:bind> tag can also be used. When using the <spring:bind> tag, the bind path should reference the command object. Following the previous example:

Example 2.20. HTML Form using <spring:bind> tag

<form action="${pageContext.request.contextPath}/MyController/saveModel.action">
    <spring:bind path="MyModelname">
    <input name="${status.expression}" value="${status.value}"/><br/>
    </spring:bind>
    ....
   <input type="submit" value="OK" />
</form>

RELATED RECIPES

  1. Implementing an HTML Form in JSP using standard HTML elements

  2. Implementing an HTML Form in JSP using Skyway Tag Library

  3. Using Third-Party Tag Libraries