Ronak Joshi
Ronak Joshi

Reputation: 1583

how to redirect to success page through servlet using ajax?

I have a jsp page which takes user name and password and then it redirect to a servlet. Below is jsp code,

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>DeliverMe</title>

    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="css/sb-admin.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

        <!-- jQuery Version 1.11.0 -->
    <script src="js/jquery-1.11.0.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#btn-login').click(function() {
        var userName = $('#userName').val();
        var password = $('#password').val();
        var datastr='userName='+userName+'&password='+ password;
        $.ajax({
            url : 'LoginCheck',
            data :datastr,
            success : function(responseText) {
                $('#ajaxGetUserServletResponse').text(responseText);
            },
        error:function(url){
            window.location = url;
          }  

        });
    });
});
</script>
</head>

</head>
<body>
  <div class="container">    
  <span style="color: #000099"><center><h2>DeliverMe Admin Panel</h2></center></span>
        <div id="loginbox" style="margin-top:50px;" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">                    
            <div class="panel panel-info" >
                    <div class="panel-heading">
                        <div class="panel-title">Sign In</div>

                    </div>     

                    <div style="padding-top:30px" class="panel-body" >

                        <div style="display:none" id="login-alert" class="alert alert-danger col-sm-12"></div>

                        <form id="loginform" class="form-horizontal" role="form">

                            <div style="margin-bottom: 25px" class="input-group">
                                        <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
                                        <input id="userName" type="text" class="form-control" placeholder="username or email">                                        
                                    </div>

                            <div style="margin-bottom: 25px" class="input-group">
                                        <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
                                        <input id="password" type="password" class="form-control" name="password" placeholder="password">
                                    </div>


                                <div style="margin-top:10px" class="form-group">
                                    <!-- Button -->

                                    <div class="col-sm- 12 controls">
                                      <a id="btn-login"  class="btn btn-success">Login</a>


                                    </div>
                                </div>
<span id="ajaxGetUserServletResponse" style="color: red;"></span>
                            </form>     


                        </div>                     
                    </div>  
        </div>

    </div>

</body>
</html>

Then my servlet checks user name and password and if it is wrong then it gives error text but if it is true then it should be redirect to success page. But it doesn't effect. Below is servlet code,

if(db.loginCheck(userName, password))
            {
                request.getRequestDispatcher("/main.jsp").forward(request, response);
            }else
            {
                 String greetings = "Invalid Username/Password";
                 response.setContentType("text/plain");
                response.getWriter().write(greetings);

            }

Upvotes: 1

Views: 3150

Answers (2)

Ronak Joshi
Ronak Joshi

Reputation: 1583

I got solution. I have changed response of my servlet like this,

if(db.loginCheck(userName, password))
            {
                response.getWriter().write("1");
            }else
            {
                 greetings = "Invalid Username/Password";
                 response.setContentType("text/plain");
                response.getWriter().write(greetings);

            }

and on my jsp page i have put this,

<script type="text/javascript">
$(document).ready(function() {
    $('#btn-login').click(function() {
        var userName = $('#userName').val();
        var password = $('#password').val();
        var datastr='userName='+userName+'&password='+ password;
        $.ajax({
            url : 'LoginCheck',
            data :datastr,
            success : function(responseText) {
                if(responseText == "1"){
                    window.location.assign("/main.jsp");
                  }else{
                      $('#ajaxGetUserServletResponse').text(responseText);
                  }
            },

        });
    });
});
</script>

Upvotes: 3

Sas
Sas

Reputation: 2503

Try this:

Servlet

if(db.loginCheck(userName, password))
{
   String greetings = "Success";
   response.setContentType("text/plain");
   response.getWriter().write(greetings);
}
else
{
   String greetings = "Invalid Username/Password";
   response.setContentType("text/plain");
   response.getWriter().write(greetings);

 }

Jquery:

 $.ajax({
        url : 'LoginCheck',
        data :datastr,
        success : function(responseText) {
          if(responseText == "Success"){
             windows.location.href='/main.jsp';
          }else{
             windows.location.href='/error.jsp';
          });

Upvotes: 0

Related Questions