forms - javascript login validation -

i have javascript function called on submit.

<script> function validatelogin() {     var x = document.forms["login"]["username"].value;     var y = document.forms["login"]["password"].value;     if (x == "" && y == "") {         alert("please enter email , password!");     } else if (x == "") {         alert("please enter email!");     } else if (y == "") {         alert("please enter password!");     } else {         return false;     } } </script> 

and called onsubmit="return validatelogin()"

the function works fine when alert appears , click okay, page refreshes. there way stop refreshing?

1. you need return false; stop form submission , page redirection, when error occurs.
2. no need of last else
3. trim username value

code:

<script> function validatelogin() {     var x = document.forms["login"]["username"].value.trim();     var y = document.forms["login"]["password"].value;     if (x == "" && y == "") {         alert("please enter email , password!");         return false; // here     } else if (x == "") {         alert("please enter email!");         return false; // here     } else if (y == "") {         alert("please enter password!");         return false; // here     } } </script> 

i'll suggest use html-5 required attribute required fields.

<form name="login">     username: <input type="text" name="username" required />     password: <input type="password" name="password" required /> </form>