Zamprota
Zamprota

Reputation: 23

<select> validation not working

hey guys i want to make validation by javascript and i tried every method in the internet it doesn't work and it clear every field and refresh the page. what i need is to validate that he choose his nationality.

here is my javascript code

function signin(){
                var a=document.forms["signin"]["inemail"].value;
                if(a==null || a==""){
                alert("Please enter an Email!!");
                document.getElementById("upemail").innerHTML="<font color=red>email is empty</font>"
                return false;
        }
            }
        function signUp(){
        var x1 = document.forms["signup"]["upemail"].value;
        var x2 = document.forms["signup"]["uppassword"].value;
        var x3 = document.forms["signup"]["repassword"].value;
        var x4 = document.forms["signup"]["fname"].value;
        var x5 = document.forms["signup"]["lname"].value;
        var x6 = document.forms["signup"]["dob"].value;
        var x7 = document.forms["signup"]["gender"].value;
        var x8 = document.forms["signup"]["nationality"].value;
        var atpos=x1.indexOf("@");
        var dotpos=x1.lastIndexOf(".");
        var date = document.getElementById('dob').value;
        var minLength = 6;
        var nationality = document.getElementByName("nationality")[0].value;


        if(x1==null || x1==""){
        alert("Please enter an Email!!");
        document.getElementById("upemail").innerHTML="<font color=red>email is empty</font>"
        return false;
        }
        else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
        {
        alert("Not a valid e-mail address");
        return false;
        }
        else if(x2==null || x2==""){
        alert("Please enter a password!!");
        return false;
        }
        else if(x3==null || x3==""){
        alert("Please re-enter your password");
        return false;
        }
        else if(document.signup.uppassword.value.length < minLength){
        alert("Password must be minimum 6 character");  
        }
        else if(x3 != x2){
        alert("password does not match");   
        }
        else if(x4==null || x4==""){
        alert("Please enter your first name");
        return false;
        }
        else if(x5==null || x5==""){
        alert("Please enter your last name");
        return false;
        }
        else if(x6==null || x6==""){
        alert("Please enter your Date of Birth");
        return false;
        }
        else if ( form.gender[0].checked == false  &&  form.gender[1].checked == false ) { 
        alert ( "Please choose your Gender: Male or Female" ); return false; 
        }
        else if (date == "" ||date == null ){ 
        alert("Date of Birth must be chosen"); 
        return false; 
        }
        else if(nationality == "none"){
        alert("Please enter your nationality")  
        }
        else{
        alert("sucssefully")
        return true;
        }


    }

here is the last try for validation

var nationality = document.getElementByName("nationality")[0].value;
else if(nationality == "none"){
    alert("Please enter your nationality")  
    }

and that is the header of form

<form name ="signup" action="" onsubmit="return signUp()" method="post">

and this part of my select tag

<select name="nationality" class="input" id="nationality">
                            <option value="none" selected>Country...</option>
                            <option value="Afganistan">Afghanistan</option>
                            <option value="Albania">Albania</option>
                            <option value="Algeria">Algeria</option>
                            <option value="American Samoa">American Samoa</option>

Upvotes: 1

Views: 176

Answers (3)

Fizk
Fizk

Reputation: 1114

You could use the selectedIndex property, which checks the selected index of your selectbox.

var elem = document.getElementById("nationality");
if(elem.selectedIndex == 0)
{
     alert("You must choose");   
}
else
{
    alert("You have chosen wisely");
}

And them use return false like you do with the rest of your fields.

Please see this fiddle for full code - http://jsfiddle.net/qb6Hb/

Upvotes: 0

MrCode
MrCode

Reputation: 64536

There is no function document.getElementByName, it's document.getElementsByName plural.

Change to

var nationality = document.getElementsByName("nationality")[0].value;

If you look at the console, you will see an error indicating this.

Upvotes: 1

Just code
Just code

Reputation: 13801

Please try

if(document.getElementById('nationality').selectedIndex == 0)
{
alert("Please select Nationality");
return false;
}

Or

objDDl = document.getElementById('nationality');
if(objDDl.options[objDDl.selectedIndex].value == "none")
{
alert("Please select nationality");
return false;
}

Upvotes: 0

Related Questions