Unable to reload the same page after clicking submit button

Question

I'm making a login page where if the email address already exists i want to stay on the same page and prompt the user that the email address already exists. Here is the function which is the onClick function that will be called when the button is clicked

function login() {

    var username = document.getElementById("username").value;
    var pword = document.getElementById("pword").value;
    var confpwd = document.getElementById("confpwd").value;
    var email = document.getElementById("email").value;
    var fname = document.getElementById("fname").value;
    var lname = document.getElementById("lname").value;
    var gender = document.getElementById("gender").value;
    var t = 1;

    if (t.toString() !== '0') {
        var er = "Email-id already exists";
        event.preventDefault();
        document.getElementById("nemail").value = er;
        document.getElementById("username").value = username;
        document.getElementById("pword").value = "";
        document.getElementById("confpwd").value = "";
        document.getElementById("fname").value = fname;
        document.getElementById("lname").value = lname;
        document.getElementById("gender").value = gender;
    }

}

Answer 1

You must pass a function to the <form onsubmit="return login()"> . The login function must return true if you want to submit and false otherwise. See this answer for more details: JavaScript code to stop form submission

Working codepen to illustrate: http://codepen.io/DeividasK/pen/YZqwLO

Answer 2

Depending on how your code is setup to submit. You may just need to insert a return when the code realizes the email address is a duplicate. Something along this path might help prevent the page from moving forward.

if (ListOfExistingEmails.indexof(email) > 0 ) return false;