CODEWITHSUNDEEP
javascripthtmlforms
Ty Givens
Ty Givens

Reputation: 111

.focus() not working in Javascript Function

I have simple form with fields for First and Last name and a salutation. I have a javascript function that should validate if the fields or empty or exceed 25 characters. The function mostly works except on .focus(); the page just reloads. Not sure what I'm doing wrong, please advise. Thanks in advance.

function validate(){
//alert ("TEST!!!");
var first = document.getElementById('firstname').value;

if (first.length == 0 || first.length > 25){

        alert ("Please enter your first name, no longer than 25 chracters.");

        document.getElementById('firstname').focus();

        return false;

        }

var last = document.getElementById('lastname').value;
if (last.length == 0 || last.length > 25){

    alert ("Please enter your last name, no longer than 25 characters.");

    document.getElementsByName('lastname').focus();

    return false;

   }

var title = document.getElementById('title').value;   
if (document.getElementById('title').selectedIndex == 0){

    alert ("Please select your salutation");

    document.getElementById('title').focus();

    return false;
}

return true;

}

In the html the form is: 

<form name="name" form id="name" method="post" onsubmit="validate();"> 
        Salutation: <select name="title" select id="title">
            <option selected="Please Select">Please select</option>
            <option value="Mr.">Mr.</option>
            <option value="Mrs.">Mrs.</option>
            <option value="Miss">Miss</option>
        </select><br><br>
        First Name : <input type="text" input id="firstname" name="firstname">
        Last Name : <input type="text" input id="lastname" name="lastname"><br><br>
        <input type="submit" value="Submit"><br><br>
</form>

Upvotes: 2

Views: 2806

Answers (1)

John Conde
John Conde

Reputation: 219924

Change:

onsubmit="validate();">

to:

onsubmit="return validate();">

Upvotes: 2

Related Questions