Code not working. Radio button validation

Question

I am using javascript for validation of radio button.

HTML-

 <form name="formreg" enctype="multipart/form-data" method="post">  
     <input type="radio" value="male" name="gender" /> Male<br />  
     <input type="radio" value="female" name="gender" /> Female<br />  
     <input value="Submit" onclick="return inputval()" type="submit" />  
 </form>

JS-

<script type="text/javascript">  
    function inputval() {  
        var $XIForm = $('form[name=XIForm]');  
        if ($("form[name='formre'] input[type='radio']:checked").length != 1) {  
            alert("Select at least male or female.");  
            return false;  
        }  
        else {  
            var gender = $("input").val();  
            //alert(gender);  
            $XIForm.submit();  
            alert(gender);  
        }  
    }  
</script>

Can anybody pls help with this code.

you may add what is nit working in your solution. that may give better answers. — Volker
– Volker, Commented Mar 13, 2014 at 12:56

mg_dev · Accepted Answer · 2014-03-13 12:38:45Z

Here is the code. You will have to create a form and validate it on submit.

HTML:-

 <form name="myForm" action="targetpage.asp" onsubmit="return validateForm();"   method="post">  
        <label>Gender</label>&nbsp&nbsp  
        <input type='radio' name='XIGender' value='Male' id="XImale" />Male  
        <input type='radio' name='XIGender' value='Female' id="XIfemale" />Female</td>  
        <input type="submit" value="submit" id="XISubmit" />  
    </form>

JS:-

 function validateForm() {  
        if (validateRadio(document.forms["myForm"]["XIGender"])) {  
            alert('All good!');  
            return false;  
        }  
        else {  
            alert('Please select a value.');  
            return false;  
        }  
    }  

    function validateRadio(radios) {  
        for (i = 0; i < radios.length; ++i) {  
            if (radios[i].checked) return true;  
        }  
        return false;  
    }

Hope this will help you. :) Enjoy coding.

XCS · Accepted Answer · 2014-03-13 12:42:58Z

Use a simple button instead of a submit button, this way you can stop the form from submitting if something is wrong and only submit it on your else branch.

<input value="Submit" onclick="return inputval()" type="button" />

http://jsfiddle.net/J62Qq/

Also, you had some typos (wrong form name).

   function inputval() {  
    var $XIForm = $('form[name=formreg]');  //you had wrong name here
    if ($("form[name='formreg'] input[type='radio']:checked").length != 1) {  
        alert("Select at least male or female.");  
        return false;  
    }  
    else {  
        var gender = $("input").val();  
        //alert(gender);  
        $XIForm.submit();  
        alert(gender);  
    }  
}

The problem with not using a submit button is that the form can not be submitted without JavaScript, but I think this is ok in your case as anyway you do not want to submit the form if you can not validate it.

Collectives™ on Stack Overflow

Code not working. Radio button validation

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related