Forms Example

Overview

Some basic guidelines for using the Form class:

• In general, the JSP should post back to itself. For example, if you have login.jsp, the <form> tag should look something like: <form method="post" action="login.jsp">
• Expose a 'get' method in your handler class for each form field that JSP displays (e.g. getUsernameField())
• Don't access the Form object in the JSP itself. Hide access to it in the JSP Handler
• Call setValue() on the Form object from within your JSP Handler to set default values for form fields

Example: Login page

Rendering the input fields

In the example login.jsp we have a form with 2 fields: username and password. In the JSP itself, these fields are rendered like this:

<table>
  <tr>
    <td align="right">Username:</td>
    <td><%=handler.getUsernameField(20, "")%></td>
  </tr>
  <tr>
    <td align="right">Password:</td>
    <td><%=handler.getPasswordField(10, "")%></td>
  </tr>
  <tr>
    <td colspan="2"><input type="submit" value="Login"></td>
  </tr>
</table>

In the call to getUsernameField() we pass in 20, which is the visible width of the field (20 characters), and an empty string. The second argument is simply a way to pass through a string that you wish to have inserted into the generated <input> field. For example, if you had a stylesheet class for all form fields, you could pass that in like this: getUsernameField(20, "class='input-style'")

The Login handler class provides the two methods called above. The implementation of these methods is trivial:

    // this generates a HTML input tag like this:
    //   <input type="text" name="username" size="[value of length var]"
    //             maxlength="30" [value of js string] >
    public String getUsernameField(int length, String js) {
        return getForm().getTextfield(USERNAME, length, 30, js);
    }

    //   <input type="password" name="password" size="[value of length var]"
    //             maxlength="30" [value of js string] >
    public String getPasswordField(int length, String js) {
        return getForm().getPassword(PASSWORD, length, 30, js);
    }

Fetching the submitted values

When a user submits the login form, the Login handler uses the Form object to fetch the value of the username and password fields:

  String username = getForm().getValue(USERNAME);
  String password = getForm().getValue(PASSWORD);

Validating form input

The Form library does not provide any built in validation methods. However, there is a suggested convention for doing field validation:

• Create a public boolean variable for each invalid state
• Create a public boolean vairable called formIsValid that is set to true by default
• Write a validation method that is called when a form is submitted that validates the input, and sets the boolean variables as needed
• Use if statements in the JSP to check for error states and print the appropriate error message

The Login handler follows this convention.

First, we declare the boolean variables at the top of the class:

    // Error states
    public boolean usernameIsBlank;
    public boolean passwordIsBlank;
    public boolean passwordIsInvalid;
    public boolean formIsValid = true;

Next, we define a method to validate the form data:

  private void validateFormData() {
    username = getForm().getValue(USERNAME);
    String password = getForm().getValue(PASSWORD);

    if(Validator.isBlank(username)) {
        formIsValid = false;
	usernameIsBlank = true;
    }

    if(Validator.isBlank(password)) {
	formIsValid = false;
	passwordIsBlank = true;
    }

    if(formIsValid) {
        // try to authenticate user
	try {
	     MemberManager.getInstance().authenticate(username, password);
	}
	catch(PasswordInvalid e) {
	     passwordIsInvalid = true;
	     formIsValid = false;
	}
    }
  }

This method is invoked by the entry point process() method that's called by the JSP itself:

    public boolean process() {
        if(isPost()) {
            validateFormData();
    	    if(formIsValid) {
                ...
            }
        }
    }