Redirecting to another page with a php script that is called with ajax

Question

I am creating a login script (just the beginning, I will lookup how to encrypt the password later on). But I can't figure out how to redirect to a certain page.

I have two possibilities now, an admin or a normal user.

My script:

$conn = new Connection;

$username = $_POST['username'];
$userpassword = $_POST['userpassword'];

if(empty($username) && empty($userpassword)){
  echo 'Vul een gebruikersnaam en wachtwoord in';
}else if(empty($username)){
  echo 'Vul een gebruikersnaam in';
}else if(empty($userpassword)){
  echo 'Vul een wachtwoord in';
}else{
  //Both filled in, begin logincode:
  $getuser = "SELECT * FROM users WHERE username = '".$conn->real_escape_string($username)."'";
  $getusercon = $conn->query($getuser);
  $getuser = $getusercon->fetch_assoc();

  if($userpassword == $getuser['password']){
    if($getuser['rights'] == '1'){
      $_SESSION['user'] = 'admin';
      // header("Location: http://www.mysite.nl/addcompany.php");
      // exit();
      header("Location: http://www.mysite.nl/addcompany.php");
      die();
      echo 'Je bent ingelogd als '.$_SESSION['user'].'';
    }else{
      $_SESSION['user'] = 'user';
      echo 'Je bent ingelogd als '.$_SESSION['user'].'';
    }
  }else{
    echo 'Wachtwoord en gebruikersnaam komen niet overeen';
  }
}

My ajax code:

// Login Ajax Code
$( "#content" ).on("submit", "#loginform", function( event ) {
  // Stop normal form behaviour
  event.preventDefault();
  // Haal de inputvelden op met zijn waardes
  var $form = $( this ),
  $username = $form.find( "input[name='username']" ).val(),
  $userpassword = $form.find( "input[name='userpassword']" ).val(),
  url = $form.attr( "action" );
  // Post above values to the action of the form
  var posting = $.post( url, { username: $username, userpassword: $userpassword} );
  // Show result in a div
  posting.done(function( data ) {
    $( "#loginresult" ).empty().slideDown('fast').append( data );
  });
});

I tried to use this:

header("Location: http://www.mysite.nl/addcompany.php");
die();

But I just see my preloader infinitely spinning and in my console I see the following:

[Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

index.php:1 [DOM] Found 8 elements with non-unique id #example-text-input: (More info: https://www.chromium.org/developers/design-documents/create-amazing-password-forms)

But that id is on the page I want to redirect too, except it doesn't redirect and just stays on the same page with my preloader spinning and those messages.

What can I do?

Answer 1

You can send on the PHP response a flag for redirect and on you JS you can add.

For example:

window.location.replace("http://stackoverflow.com");
window.location.href = "http://stackoverflow.com";