login

Subscribe to JSP Tutorial website RSS Feed RSS Feed
 » JSP Tutorial » Working with HTML Form - part I

Working with HTML Form

HTML form basically is a graphic user interface (GUI) which you present to get the input data from the users. Once user submits the form from the client side; from the server side, you need to capture those data for further processing such as business logic validation, saving the data into the database and so on. Let start with a simple HTML form which getting user information.

<html>
    <head>
        <title>JSP Form Demo</title>
        <style type="text/css">
            label{ margin-right:20px;}
            input{ margin-top:5px;}
        </style>
    </head>
    <body>
        <form action="handleUserInfo.jsp" method="post">
            <fieldset>
                <legend>User Information</legend>
                <label for="fistName">First Name</label>
                <input type="text" name="firstName" /> <br/>
                <label for="lastName">Last Name</label>
                <input type="text" name="lastName" /> <br/>
                <label for="email">Email</label>
                <input type="text" name="email" /> <br/>
                <input type="submit" value="submit">
            </fieldset>
        </form>
    </body>
</html>

The form is very simple which contains three fields: first name, last name and email. In addition, It contains the submit button which users can submit when he/she finish entering the data.

JSP Form

In the form tag, you can see it uses the post method to post the data to the server. In the server a JSP file will responsible for getting and processing the data. Here is the handleUserInfo.jsp code.

<html>
    <head>
        <title>JSP Form Demo</title>
    </head>
    <body>
        <%
            String firstName = request.getParameter("firstName");
            String lastName = request.getParameter("lastName");
            String email = request.getParameter("email");
        %>
        <p>Hi <%=firstName%> <%=lastName%>!, 
your submitted email is <%=email%>.</p>
    </body>
</html>

The request object is used to get the data from the submitted form. The getParameter method of request object accepts the name of the form field and return the value. The return value of the getParameter method is always String type so if you have form field which accepts numerical value, you have to convert it. If no form field found, the getParameter method will return null.  After getting the values from the form, handleUserInfo.jsp uses those values to print out a message.

JSP Form 1

JSP Form

In this tutorial, you've use the request object to get the data from a HTML form. The form and the JSP is seperated. In the next tutorial, you will learn how to handle HTML form inside a single JSP page.