user611102
user611102

Reputation: 11

Conditional validation with jquery

I have a form with a number of radio button options, all are required.

However I want to add an extra validation on one selection of radio buttons.

For example:

If a value selected equals "Brown" further validation is then needed only on this colour, such as

input:radio[name='radTypeJoint']:checked").val() == 'Shear' 
&& 
input:radio[name='radSubstrate']:checked").val() == 'Masonry to Masonry'

return false;

Any ideas, many thanks Adam

I've now got it to this:

radShade: { required: function(element) {  
                if (($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radGeographical']:checked").val() == 'South Facing') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radGeographical']:checked").val() == 'West Facing') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radMovement']:checked").val() != 'Increase of 12 of minimum joint width') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radStories']:checked").val() != 'Less than 3') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radSubstrate']:checked").val() != 'Masonry to Masonry') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radElements']:checked").val() == 'Window') || ($("input:radio[name='radShade']:checked").val() == 'Brown') && ($("input:radio[name='radTypeJoint']:checked").val() == 'Fillet')) {
                alert("This shade is not available with your current selections");
                return false;
                };
            }

but the form is still be submitted even if I but return true or return false.

Upvotes: 1

Views: 750

Answers (1)

Sukhjeevan
Sukhjeevan

Reputation: 3156

Check it Out:

HTML:

<input name="radiobutton" type="radio" value="brown" id="all" runat="server" class="cssRadio"/>
<input name="radiobutton" type="radio" value="black" id="Radio1" runat="server" class="cssRadio"/>
<input name="radiobutton" type="radio" value="red" id="Radio3" runat="server" class="cssRadio"/>

JQUERY:

$(".cssRadio").click(function(){
    if($(this).val()=="brown")
    {
        //here u get the object of clicked radion button now do your validation
        alert($(this).val());
    }
    if($(this).val()=="black")
    {
        //here u get the object of clicked radion button now do your validation
        alert($(this).val());
    }
});

Upvotes: 1

Related Questions