checking username and password with database using JSP and jQuery. (JSP forum at Coderanch)

Greenhorn

Posts: 10

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Hi,
I created a login page in HTML and I created a servlet and when I submit the form it will go to the search servlet and display the user details if the username and password are correct or it will go to new page and display the error page.

But, now I want to display the error message on the login form itself if the username or password incorrect. How can I connect these two pages and display the error message if the login details are incorrect or it should display the user details if the login details are correct.
I want to display an error message instead of redirecting to the new page when the username or password incorrect. For that I am using jQuery.

Thank You.
Here is my code.

Login.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Web Form</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>
            $(document).ready(function() {

$('form').on('submit', function(e) {
                    e.preventDefault();

$.ajax({
                        url: 'process.jsp',
                        async: true,
                        cache: false,
                        type: 'POST',
                        data: $(this).serialize(),
                        dataType: 'html',
                        success: function(data) {
                            $('#error_box').html(data);

if(data === 'Success!'){
                                window.location = 'Experiment.html';
                            }
                        }
                    });
                });

});
        </script>
    </head>

<body>
        <form mehtod="post" action="process.jsp">
        	<center><h2>Form</h2></center>
            Username : <input type="text" name="username" /><br>
            Password : <input type="password" name="password" /><br>
            <input type="submit" value="submit" />
        </form>
        <div id="error_box"></div>
    </body>
</html>

SearchServlet
URL : search

package com.codejava;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

/**
 * Servlet implementation class SearchServlet
 */
public class SearchServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public SearchServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		
	}

/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		CustomerDAO customerDAO = new CustomerDAO();
                // Database connection is in CustomerDAO
		String username = request.getParameter("LoginId");
		String password = request.getParameter("LoginPassword");
		System.out.println(username);
		
		Login login = customerDAO.getLoginByName(username, password);
		
		PrintWriter out = response.getWriter();
		if (login == null){
		out.println("<html><body>");
		out.println("<center><h3>SignIn failed, wrong username or password</h3></center>");
		out.println("<center>Please try again to <a > SignIn </a> here.</center>");
		out.println("</body></html>");
			}else {
		out.println("<html><body>");
		out.println("<center><h1>User Information</h1></center>");
		out.println("<center><table border=0x>");
 		out.println("<tr>");
 		out.println("<td>Login Id : </td><td>"+login.getLoginId()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>City : </td><td>"+login.getCity()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>State : </td><td>"+login.getState()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>Cell Number : </td><td>"+login.getCellnumber()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>Email :</td><td>"+login.getEmail()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>Address :</td><td>"+login.getAddress()+"</td>");
 		out.println("</tr>");
 		out.println("<tr>");
 		out.println("<td>ZipCode : </td><td>"+login.getZipcode()+"</td>");
 		out.println("</tr>");
 		out.println("</table></center>");
		out.println("<p><center>If these details are correct press continue or to change your information press update.</center></p>");
		out.println("<form action='Continue.jsp'>");
		out.println("<center><input type=submit value=continue></center>");
		out.println("</form>");
		out.println("<form action='search'>");
		out.println("<center><a > update </a></center>");          
		out.println("</form>");
		out.println("</body></html>");
		
		Login l = new Login();
		 l.setLoginId(request.getParameter("LoginId"));
		
		if(l!=null) {
			HttpSession session = request.getSession();
			session.setAttribute("l", l);
			}
	}
	}
}

Bear Bibeault

Sheriff

Posts: 67753

173

I like...

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I see you went ahead and edited your post after I answered. Please don't do that. Make new posts with updated code. Replacing the original post after I replied made my replies look like nonsense.

[Asking smart questions] [About Bear] [Books by Bear]

HTML 5 (verified skill)
Skill verified by Jeanne Boyarsky

CSS 3 (verified skill)
Skill verified by Jeanne Boyarsky

JavaScript (verified skill)
Skill verified by Jeanne Boyarsky

kumar sapan

Greenhorn

Posts: 10

posted 11 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Bear Bibeault wrote:When your code has been refactored, please post it as a new reply and let us know what problems you are having with it.

I created HTML page and servlet for login page and to display the user details. In that servlet, a new error page will be displayed if the username or password are wrong.
Now, I am trying to display the error message on the same login page if the user details are wrong by adding jQuery to it. In servlet I am doing the comparison with database
but I don't have any idea how to connect the jQuery to the servlet.

here is my code...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Web Form</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script>
            $(document).ready(function() {

$('form').on('submit', function(e) {
                    // don't let the browser submit the form
                    e.preventDefault();

$.ajax({
                        url: 'search',
                        async: true,
                        cache: false,
                        type: 'POST',
                        data: $(this).serialize(),
                        dataType: 'html',
                        success: function(data) {
                            $('#error_box').html(data);

if(data === 'Success!'){
                                window.location = 'DisplayServlet';
                            }
                        }
                    });
                });

});
        </script>
    </head>

<body>
        <form method="post" action="search">
        	<center><h2>Form</h2></center>
            Username : <input type="text" name="username" /><br>
            Password : <input type="password" name="password" /><br>
            <input type="submit" value="submit" />
        </form>
        <div id="error_box"></div>
    </body>
</html>

package com.codejava;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

/**
 * Servlet implementation class SearchServlet
 */
public class SearchServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public SearchServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		
	}

/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		CustomerDAO customerDAO = new CustomerDAO();
		String username = request.getParameter("LoginId");
		String password = request.getParameter("LoginPassword");
		System.out.println(username);
		
		Login login = customerDAO.getLoginByName(username, password);
		
		PrintWriter out = response.getWriter();
		if (login == null){
		System.out.println('Success!');
			}else {
                RequestDispatcher rd = request.getRequestDispatcher("DisplayServlet");
		rd.forward(request, response);
	}
	}
}