Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Jquery vallidator rule for filling at least one field between a group

    • 0
    • 1
    • 1
    • 2
    • 0
    • 0
    • 0
    • 0
    • 1.29k
    Comment on it
    <script type="text/javascript">
    
     $(document).ready(function()
        {   
         jQuery.validator.addMethod("require_from_group", function (value, element, options) {
            var numberRequired = options[0];
            var selector = options[1];
            var fields = $(selector, element.form);
            var filled_fields = fields.filter(function () {
                // it's more clear to compare with empty string
                return $(this).val() != "";
            });
            var empty_fields = fields.not(filled_fields);
            // we will mark only first empty field as invalid
            if (filled_fields.length < numberRequired && empty_fields[0] == element) {
                return false;
            }
            return true;
            // {0} below is the 0th item in the options field
        }, jQuery.format("'Please enter either username/ email address to recover password'/Please fill out at least {0} of these fields."));
    
        var validator = $("#myForm").validate({
    
            groups: {
                names: "num1 num2"
            },
            rules: {                            
                  num1: {
                    require_from_group: [1, ".send"]
                },
                num2: {
                    require_from_group: [1, ".send"]
                },                            
            },  
            errorElement: "span" ,                              
            messages: {
                name: " Enter Name",
                 email: {required: "EmailId is required.",email: "Please enter the valid email address"},           
            }
        });
        if(validator.form()){ // validation perform
            $('form#myForm').attr({action: 'mycontroller'});           
            $('form#myForm').submit();
        }
     });   
    </script>
    
        <form method="post" id="myForm" name="myForm">
        <h2 class="widgettitle2" style="margin: 13px 0px 2px 0px">Contact Us</h2>
        <p class="legend"><strong>Note:</strong> Required fields are marked with an asterisk (<em>*</em>)</p>           
        <fieldset>      
            <div><label for="name">Email<em>*</em></label> <input tabindex="1" size="40" type="text" name="num2" id="num2"  class="send_email send"/></div>
           <div><label for="Username">Username<em>*</em></label> <input tabindex="1" size="40" type="text" name="num1" id="num1" class="send_username send"/></div>    
        </fieldset> 
        <div class="buttonrow"><input tabindex="6" type="submit" class="btn" value="Submit" /> <input tabindex="7" type="button" class="btn" value="Cancel" /></div>    
    </form>    
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: