javascript gender validation [closed]

Question

Closed. This question needs details or clarity. It is not currently accepting answers.

---

Want to improve this question? Add details and clarify the problem by editing this post.

Closed 9 years ago.

Improve this question

i'm trying to make a validation for registration form but i got a problem with gender validation using radio button in javascript.. i hope anyone can help me to solve this problem :D

here is my code

function validate(form)
{
    var genderM=form.gender_male.value;
    var genderF=form.gender_female.value;

    if(genderM.checked==false && genderF.checked==false )
       {
            alert("You must select male or female");
            return false;
       }   
 }

Answer 1

You also need to remove the .value's

function validate(form)
{
    var genderM=form.gender_male;
    var genderF=form.gender_female;

    if(genderM.checked==false && genderF.checked==false ) {
        alert("You must select male or female");
        return false;
    }   
}

Answer 2

You have a typo. You're using genderM twice instead of genderF on the second assignment

   function validate(form)
    {
        var genderM=form.gender_male.value;
        var genderF=form.gender_female.value; //error here

        if(genderM.checked==false && genderF.checked==false )
           {
                alert("You must select male or female");
                return false;
           }   
     }

Answer 3

Without seeing the relevant HTML and associated event assignment, then you may be looking to do something like this example.

HTML

<form id="test">
    <label for="gender">Gender:</label>
    <input type="radio" name="gender" value="0">Male</input>
    <input type="radio" name="gender" value="1">Female</input>
    <input type="submit" value="Submit">
</form>

Javascript

function validate(form) {
    var isChecked = Array.prototype.some.call(form.querySelectorAll('input[name=gender]'), function (radio) {
        return radio.checked;
    });

    if (!isChecked) {
        alert("You must select Male or Female");
    }

    return isChecked;
}

document.getElementById('test').addEventListener('submit', function (evt) {
    if (!validate(evt.target)) {
        evt.preventDefault();
    }
});

On jsFiddle

Answer 4

You could do it like this:

HTML:

<form name="foo">
    <input name="gender" type="radio" value="m" /> Male
    <input name="gender" type="radio" value="f" /> Female
    <input type="button" onclick="validateGender()" value="validate" />
</form>

JavaScript:

<script>
    function validate(form) {
        var gender = form.querySelectorAll('input[name="gender"]:checked');
        if (!gender.length) {
            alert('You must select male or female');
            return false;
        }
    }
</script>

Demo

Hope this helps.

Edit: I edited the script so the form is now passed as parameter as in your script.