Registration Form in JSP

Introduction

In this article we define how to create a registration form in JSP. The NetBeans IDE is used to create the Registration Form.

Registration Form in JSP

There are many ways to create a registration form in JSP, such as using a separate Java class for the JDBC connection, using a servlet for the JDBC connection, using a DAO class for the database connection, etcetera but in this I use only two JSP classes.

We need to create the following class:

  • signuppage.html
  • processdata.jsp
  • reg.sql

1. signuppage.html

This file is used to create a form page. This form is used to get the user data from the user, after taking user information this page processes information to another page that we named "processdata.jsp".

2. processdata.jsp

This JSP page is used to set up the database connection and save user information in our database "reg".

3. reg.sql

This is an Oracle database table, used to save user records in the database.

Syntax

create table reg 
 (
   uname varchar2(20), umail varchar2(30), upass varchar2(20),
   udob varchar2(20), ugender varchar2(20), uphone varchar2(20),
   ucountry varchar2(20)
 );

Let's start creating Registration form in JSP

We need to follow several steps in the NetBeans IDE for creating this form.

Step 1

Open the NetBeans IDE.

NetBeans IDE

Step 2

Choose "Java web" -> "Web application" as shown below.

Java Web App

Step 3

Type your project name as "RegistrationFormApp" as in the following.

Registration Form App

Step 4

Now choose your Java version and server wizard as shown below.

server wizard

Step 5

Now create a new HTML file named "signuppage.html" with the following.

signuppage.html

<!DOCTYPE html>

<html>

    <head>

        <title>User-SignUp</title>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <meta name="viewport" content="width=device-width">

    </head>

    <body bgcolor="pink">

        <form action="processdata.jsp">

            <center>

                <h1>Welcome User Please fill the detail below</h1>

                <table border="2" bgcolor="grey" style="color:blue">

                    <tr>

                        <td>

                            <b>User Name:</b>

                        </td>

                        <td>

                            <input type="text" name="uname">

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Email-ID:</b>

                        </td>

                        <td>

                            <input type="email" name="uemail"

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Create Password:</b>

                        </td>

                        <td>

                            <input type="password" name="upass">

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Confirm Password:</b>

                        </td>

                        <td>

                            <input type="password" name="upass">

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>D.O.B</b>

                        </td>

                        <td>

                            <input type="text" name="udob">

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Gender:</b>                       

                        </td>

                        <td>

 

                        </td></tr>

                    <tr>  

                        <td>

                            <input type="radio" name="ugender" value="Male">Male

                        </td>

                        <td>

                            <input type="radio" name="ugender" value="Female">Female

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Phone No:</b>

                        </td>

                        <td>

                            <input type="text" name="uphone">

                        </td>

                    </tr>

                    <tr>

                        <td>

                            <b>Country:</b>

                        </td>

                        <td>

                            <input type="text" name="uloc">

                        </td>

                    </tr>   

                    <tr>

                        <td>

                            <input type="submit" value="SignUp">

                        </td>

                        <td>

                            <input type="reset" value="Reset">

                        </td>

                    </tr>

                </table>

        </form>

    </body>

</html>

Step 6

Now create a JSP file named "processdata.jsp" with the following:

processdata.jsp

<%@ page language="java" import="java.sql.*"%>

<%

    String name = request.getParameter("uname");

    String email = request.getParameter("uemail");

    String pass = request.getParameter("upass");

    String dob = request.getParameter("udob");

    String gender = request.getParameter("ugender");

    String phone = request.getParameter("uphone");

    String country = request.getParameter("uloc");

    String role = request.getParameter("urole"); 

    try {

        Class.forName("oracle.jdbc.driver.OracleDriver");

        Connection con = DriverManager.getConnection("jdbc:oracle:thin:@mcndesktop07:1521:XE", "sandeep", "welcome");

        PreparedStatement ps = con.prepareStatement("insert into reg values(?,?,?,?,?,?,?)");

        ps.setString(1, name);

        ps.setString(2, email);

        ps.setString(3, pass);

        ps.setString(4, dob);

        ps.setString(5, gender);

        ps.setString(6, phone);

        ps.setString(7, country);

        ps.executeUpdate();

        out.println("Data saved successfully");

    } catch (Exception e) {

        out.println(e);

    } 

%>

Step 7

Now our project is ready to run.

Right-click on the project menu, then select "Run". The following output is generated there.

Registration Form

Step 8

Fill in the given details there.

Filling Form

Step 9

Click on the "Submit" button. The following message is shown there.

Data Save Message

Note

If you have the same message then that means you have done it successfully, else check your code.

Step 10

For confirmation of the saved data,

go to the Oracle database home page login with your username and password and then check that your data was saved there. As I do that I get the data in the database as in the following

reg.sql