CODEWITHSUNDEEP
javascriptjqueryvalidation
khtims75
khtims75

Reputation: 81

jquery form.validate conditional required

I am trying to get a form to validate based on information that was submitted. Everything works fine if I make all fields required but my validation does not work as soon as I put in an if statement on the requirement.

Does not work:

var form = $( "#send_request_sms" );
    form.validate({
       rules: {
           first_name: { 
             required: true 
           } , 
               last_name: { 
               required: true 
           },              
                        mobile: { 
               required: $('#email').val() ? false : true
           },   
                email: {
                    required: $('#mobile').val() ? false : true
                }
       },

    });

Works fine:

var form = $( "#send_request_sms" );
    form.validate({
       rules: {
           first_name: { 
             required: true 
           } , 
               last_name: { 
               required: true 
           },              
                        mobile: { 
               required: true
           },   
                email: {
                    required: true
                }
       },

    });

Thanks for the help!

Upvotes: 1

Views: 63

Answers (3)

Nabin Nembang
Nabin Nembang

Reputation: 753

I generally use depends and works in my case

var form = $( "#send_request_sms" );
form.validate({
   rules: {
       first_name: { 
         required: true 
       } , 
       last_name: { 
           required: true 
       },              
        mobile: { 
           required: {depends: function(element) {
                         return jQuery("#email").val() == '' ? true : false;
                        }
                     }
              },   
            email: {
                required: {depends: function(element) {
                        return jQuery("#mobile").val() == '' ? true : false;
                        }
                     }
            }
   }

});

Upvotes: 2

James J. Hill
James J. Hill

Reputation: 139

I would recommend moving the conditional statement outside the validate object.

e.g.

var form = $("#send_request_sms");
var mobileRequired = $('#email').val() ? false : true;
var emailedRequired = $('#mobile').val() ? false : true;
form.validate({
   rules: {
       first_name: { 
         required: true 
       }, 
       last_name: { 
         required: true 
       },              
       mobile: { 
         required: mobileRequired
       },   
       email: {
         required: emailRequired
       }
   }
});

Upvotes: 0

Rahul Kadukar
Rahul Kadukar

Reputation: 958

I think you missed the order of email and mobile

var form = $( "#send_request_sms" );
form.validate({
   rules: {
       first_name: { 
         required: true 
       } , 
       last_name: { 
           required: true 
       },              
       mobile: { 
           required: $('#mobile').val() ? false : true
       },   
       email: {
           required: $('#email').val() ? false : true
       }
   },

});

Upvotes: 0

Related Questions