Here we have created a simple login form using MySQL Database Connection and back end validation. We have also added a video tutorial of the program that will guide you in creating it. We will be using Eclipse IDE for compile and Tomcat 7 server for deploying the application.
The record will be fetched from database and matched with the input value given through the login form.
Example of creating the login form is given below with code and images:
We will create a simple login logout example using JSP. When a user inputs information in a form, it is validated with the record saved into the database table. So first we create a database table that will have dummy values inserted by us.
We have used JSP implicit object session and setAttribute() method for setting the attribute value in session and getAttribute() method for getting the attribute value from the same session. invalidate() method is used for ending the session.
Then other jsp pages like home.jsp, login.jsp, logout.jsp, welcome.jsp, error.jsp and index.jsp pages will be created.
Following video will help you to create JSP Login form backed with MySQL database:
The following image is of the Database table that shows the information added in it. It is with these values that the program checks the information added by the user and returns the result.
home.jsp
When compiling the program in eclipse, the home page will include the following code and the page will look like the one in the image. home.jsp page has the interface for the user to input and submit their records.
<%@ page import="java.sql.*" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Home</title>
</head>
<body>
<%
Connection con= null;
PreparedStatement ps = null;
ResultSet rs = null;
String driverName = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://localhost:3306/record";
String user = "root";
String password = "root";
String sql = "select usertype from userdetail";
try {
Class.forName(driverName);
con = DriverManager.getConnection(url, user, password);
ps = con.prepareStatement(sql);
rs = ps.executeQuery();
%>
<form method="post" action="login.jsp">
<center><h2 style="color:green">JSP Login Example</h2></center>
<table border="1" align="center">
<tr>
<td>Enter Your Name :</td>
<td><input type="text" name="name"/></td>
</tr>
<tr>
<td>Enter Your Password :</td>
<td><input type="password" name="password"/></td>
</tr>
<tr>
<td>Select UserType</td>
<td><select name="usertype">
<option value="select">select</option>
<%
while(rs.next())
{
String usertype = rs.getString("usertype");
%>
<option value=<%=usertype%>><%=usertype%></option>
<%
}
}
catch(SQLException sqe)
{
out.println("home"+sqe);
}
%>
</select>
</td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="submit"/></td>
</table>
</form>
</body>
</html>
login.jsp
The login page in the Eclipse will have the following code and the page will look like the one in the image. login.jsp page is where the code for getting the input field values and the database table records is written. sql query is used to fetch the matched record from table.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login</title>
</head>
<body>
<%! String userdbName;
String userdbPsw;
String dbUsertype;
%>
<%
Connection con= null;
PreparedStatement ps = null;
ResultSet rs = null;
String driverName = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://localhost:3306/record";
String user = "root";
String dbpsw = "root";
String sql = "select * from userdetail where name=? and password=? and usertype=?";
String name = request.getParameter("name");
String password = request.getParameter("password");
String usertype = request.getParameter("usertype");
if((!(name.equals(null) || name.equals("")) && !(password.equals(null) || password.equals(""))) && !usertype.equals("select"))
{
try{
Class.forName(driverName);
con = DriverManager.getConnection(url, user, dbpsw);
ps = con.prepareStatement(sql);
ps.setString(1, name);
ps.setString(2, password);
ps.setString(3, usertype);
rs = ps.executeQuery();
if(rs.next())
{
userdbName = rs.getString("name");
userdbPsw = rs.getString("password");
dbUsertype = rs.getString("usertype");
if(name.equals(userdbName) && password.equals(userdbPsw) && usertype.equals(dbUsertype))
{
session.setAttribute("name",userdbName);
session.setAttribute("usertype", dbUsertype);
response.sendRedirect("welcome.jsp");
}
}
else
response.sendRedirect("error.jsp");
rs.close();
ps.close();
}
catch(SQLException sqe)
{
out.println(sqe);
}
}
else
{
%>
<center><p style="color:red">Error In Login</p></center>
<%
getServletContext().getRequestDispatcher("/home.jsp").include(request, response);
}
%>
</body>
</html>
This is the login form which a user will see when the program is completed.
welcome.jsp
The welcome page in the Eclipse will have the following code and the page will look like the one in the image. welcome.jsp page is where the code for displaying the valid user name after the values are matched is written.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Welcome</title>
</head>
<body>
<p>Welcome, <%=session.getAttribute("name")%></p>
<p><a href="logout.jsp">Logout</a>
</body>
</html>
This page will be shown to the user when he Logs in successfully.
error.jsp
The error page in the Eclipse will have the following code and the page will look like the one in the image. error.jsp page is where the code for displaying the error message when any problem occurs in logging in is written. This page is shown when the information entered by the user does not matches with the one in database.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login Error</title>
</head>
<body>
<center><p style="color:red">Sorry, your record is not available.</p></center>
<%
getServletContext().getRequestDispatcher("/home.jsp").include(request, response);
%>
</body>
</html>
logout.jsp
The logout page in the Eclipse will have the following code and the page will look like the one in the image. logout.jsp page is where the code for logout of user from the application is written.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Logout</title>
</head>
<body>
<% session.invalidate(); %>
<p>You have been successfully logout</p>
</body>
</html>
Next: Read all the tutorials of JSP. 0