Redirect To Another Page In Php Through Ajax

My page is gathering info from javascript and sending it to PHP and then to MySQL, issue is that i want it to redirect to different pages depending on the data i have in the DB, I'

Solution 1:

Use proper AJAX format to handle the response in client side here is the modified code

login.html

      <div class="wrap-input100 validate-input" data-validate = "Enter username">
      <inputclass="input100"type="text"id="user"name="username"placeholder="Email"><spanclass="focus-input100"data-placeholder="&#xf207;"></span></div><divclass="wrap-input100 validate-input"data-validate="Enter password"><inputclass="input100"type="password"id="pass"name="pass"placeholder="Password"><spanclass="focus-input100"data-placeholder="&#xf191;"></span></div><divclass="container-login100-form-btn"><aclass="login100-form-btn"id = "logBtn">
      Login
      </a></div><scriptsrc="https://code.jquery.com/jquery-2.2.4.min.js"></script><script>
      $('#logBtn').click(function(event){ 
          user = document.getElementById("user").value;
          password = document.getElementById("pass").value;

          $.ajax({
              type:"POST",
              url:"login.php",
              async: false,
              data: {user:user,password:password},
              success: function(data){
              alert(data);
          if(data=="admin"){
                  window.location="https://..Main/index.html";
                }
        if(data=="user"){
                  window.location="https://....startemp.html";
                }
              }
              });
          });

      </script>

login.php

<?php$servername = "localhost";
      $username = "root";
      $password = "root";
      $dbname = "test";

      $conn = new mysqli($servername, $username, $password, $dbname);

      $user = $_POST['user'];
      $pass = $_POST['password'];

      $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'"; 

      $result = mysqli_query($conn, $sql);

      if (mysqli_num_rows($result) > 0) {
          $sql_1 = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
           $result_1 = mysqli_query($conn, $sql_1);
          if (mysqli_num_rows($result_1) > 0){

              echo"admin";
              exit(0);
            }
             else{
          echo"user"; 
           exit(0);
          }

       } else {
          $msg = "username/password invalid";
          echo$msg;
       }

      mysqli_close($conn);
      ?>

Solution 2:

You can use a JSON type of response to the Ajax Request so that the Ajax callback will handle the redirection.

SCRIPT

$('#logBtn').click(function(event){ 
    user = document.getElementById("user").value;
    password = document.getElementById("pass").value;

    $.ajax({
        type:"POST",
        url:"login.php",
        dataType: "JSON",
        async: false,
        data: {
            user:user,
            password:password
        },
        success: function(data){
            alert(data.message);
            alert(data.redirect);
            window.location.href = data.redirect;
        }
    });
});

PHP

<?php$servername = "localhost";
$username = "root";
$password = "tbjdjkdl";
$dbname = "dbbbbbb";

$conn = new mysqli($servername, $username, $password, $dbname);

$user = $_POST['user'];
$pass = $_POST['password'];

$sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass'"; 
$result = mysqli_query($conn, $sql);
$return = array();

if (mysqli_num_rows($result) > 0) {
    $sql = "SELECT * FROM users WHERE email='$user' AND clave='$pass' AND permisos='Administrador'";
    if (mysqli_num_rows($result) > 0){
        $return = array(
            "message" => "admin",
            "redirect" => "../Main/index.html";
        );
    }
    else{
        $return = array(
            "message" => "user",
            "redirect" => "../Main/startemp.html";
        );
    }

} else {
    $return = array(
        "message" => "username/password invalid",
        "redirect" => "";
    );
}

echo json_encode($return);
mysqli_close($conn);
exit;
?>

Solution 3:

$('#logBtn').click(function(event){ 
    user = document.getElementById("user").value;
    password = document.getElementById("pass").value;

    $.ajax({
        type:"POST",
        url:"login.php",
        async: false,
        data: {user:user,password:password},
        success: function(data){
             if(data == 'admin'){
                window.location.href='../Main/index.html';
             }
             elseif(data == 'user'){
                window.location.href='../Main/startemp.html';
             }else{
               alert(data);
             }
        });
    });

//please remove the line header() on login.php;