location.href not redirecting to user page

Question

I have a form which is is linked to signup.js which when someone presses the button start chatting it should redirect to user.php in my case it's not working

location.href = "user.php"; 

is giving the problem because i get success when i submit the form. But it doesn't work. It simply stays on the login page and nothing happens but gives sucess

const form = document.querySelector(".signup form"),
continueBtn = form.querySelector(".button input"),
errorText = form.querySelector(".txt-error");

form.onsubmit = (e) => {
    e.preventDefault();    //preventing from submitting
}

continueBtn.onclick = () =>{

   // AJAX code refernce w3schools
   let xhr = new XMLHttpRequest(); //object created
   xhr.open("POST", "php/signup.php", true);
   xhr.onload = () =>{
       if(xhr.readyState === XMLHttpRequest.DONE){
           if(xhr.status === 200){
               let data = xhr.response;
               if(data == "success"){
                    location.href = "user.php";
               }else{
                    errorText.textContent = data;
                    errorText.style.display = "block"; 
              }
           }
       }
    }
    // send form data to php through ajax
    let formData = new FormData(form);  //obj created
    xhr.send(formData); //sending data to php
}

These are my codes any help will be appreciated. What I am doing is that when the user clicks the submit button an ajax request is being executed to target php script which logs in the user and if user is logged in successfully then echoes back the message "login_successful" to the ajax request. By using if statement I check whether the message is "login_successful" else display the error.

If the message is "login_successful" the script redirects the user to the new page 'user.php' by using

Answer 1

Your form variable is selected with .signup form, which will find the first <form> element within the first element with a signup class. For example:

<div class = "signup">
  <form>
    ...
  </form>
</div>

Presumably, you have a form with the class signup, so you want the selector form.signup

Once you select the correct element, your form.onsubmit listener should work.

The same goes for your continueBtn selector - right now it's selecting an <input> element inside another element with the class button. Presumably you want the selector input.button.