Jquery Validation Rules with If/ Else statement

Grant Noel picture Grant Noel · Sep 9, 2014 · Viewed 25.7k times · Source

This code works but I need it to basically do an If Else on the id field. If the id length is >0 then do not check name, zipcode as required. If the id is not > 0 then check name, zipcode, etc as required. Your suggestions are welcomed. Thanks,

 runAllForms();
 $(function () {
 $("#artist_create_event").validate({

        // Rules for form validation
        rules : {
            artist_create_event_name : {
                required : true
            },
            artist_create_event_desc : {
                required : true
            },
            id :  {
                required : true
             },
            name :  {
                required : true
             },
            zipcode :  {
                required : true
             },
            venue_name :  {
                required : true
             },
            city :  {
                required : true
             },
            state :  {
                required : true
             },
            location :  {
                required : true
             },
            event_address : {
                required : true
            }
        },

        // Messages for form validation
        messages : {
            artist_create_event_name : {
                required : 'Enter Event Name'
            },
            artist_create_event_desc : {
                required : 'Enter Event Description'
            },
            name : {
                required : 'Enter Venue Name'
            },
            zipcode : {
                required : 'Please enter Zipcode/Postalcode'
            },
            venue_name : {
                required : 'Enter Venue Name'
            },
            city : {
                required : 'Please enter City'
            },
            state : {
                required : 'Please enter State'
            },
            location : {
                required : 'Please enter Country'
            },
            event_address : {
                required : 'Please enter Address'
            }
        },

 //  Do not change code below
        errorPlacement : function(error, element) {
            error.insertAfter(element.parent());
        },
    // Ajax form submition
   submitHandler: function() {
    $('#artist_create_event').hide(0);
    $('#art_event_message').hide(0);
    $.ajax({
        url : 'artist_update_event.php',
        type : 'POST',
        dataType : 'json',
        data: {
            artist_create_event_name: $('#artist_create_event_name').val(),
            artist_create_event_desc: $('#artist_create_event_desc').val(),
            name: $('#name').val(),
            city:  $('#city').val(),
            state:  $('#state').val(),
            location:  $('#location').val(),
            zipcode:  $('#zipcode').val(),
            event_address : $('#event_address').val(),
            event_address2 : $('#event_address2').val()
        },
        success : function(data){
            $('#art_event_message').removeClass().addClass((data.error === true) ? 'error' :     'success')
                .text(data.msg).show(500);
            if (data.error === true) {
                if (data.goto == 1)       {
 delete json;
                }
                else {
                $('#artist_create_event').show(500);
delete json;
                }
                 }
            if (data.error === false) {

                $('#artist_create_event').show(500);
delete json;
                }
                },
        error : function(XMLHttpRequest, textStatus, errorThrown) {
            $('#art_event_message').removeClass().addClass('error')
alert('The error was: '+errorThrown);
alert('The error was: '+XMLHttpRequest);
alert('The error was: '+textStatus);
//                  .text('response.Text').show(500);
            $('#artist_create_event').show(500);
        }
    });

    return false;
    }

    });

});

Answer

Arun P Johny picture Arun P Johny · Sep 9, 2014

You can pass the value of required as a function as given below, assuming id is the name of a input field

var $id = $('input[name="id"]')
$("#artist_create_event").validate({

    // Rules for form validation
    rules: {
        artist_create_event_name: {
            required: true
        },
        artist_create_event_desc: {
            required: true
        },
        id: {
            required: true
        },
        name: {
            required: function () {
                return $id.val().length > 0;
            }
        },
        zipcode: {
            required: function () {
                return $id.val().length > 0;
            }
        },
        venue_name: {
            required: true
        },
        city: {
            required: true
        },
        state: {
            required: true
        },
        location: {
            required: true
        },
        event_address: {
            required: true
        }
    },

    // Messages for form validation
    messages: {
        artist_create_event_name: {
            required: 'Enter Event Name'
        },
        artist_create_event_desc: {
            required: 'Enter Event Description'
        },
        name: {
            required: 'Enter Venue Name'
        },
        zipcode: {
            required: 'Please enter Zipcode/Postalcode'
        },
        venue_name: {
            required: 'Enter Venue Name'
        },
        city: {
            required: 'Please enter City'
        },
        state: {
            required: 'Please enter State'
        },
        location: {
            required: 'Please enter Country'
        },
        event_address: {
            required: 'Please enter Address'
        }
    },

    //  Do not change code below
    errorPlacement: function (error, element) {
        error.insertAfter(element.parent());
    },
    // Ajax form submition
    submitHandler: function () {
        $('#artist_create_event').hide(0);
        $('#art_event_message').hide(0);
        $.ajax({
            url: 'artist_update_event.php',
            type: 'POST',
            dataType: 'json',
            data: {
                artist_create_event_name: $('#artist_create_event_name').val(),
                artist_create_event_desc: $('#artist_create_event_desc').val(),
                name: $('#name').val(),
                city: $('#city').val(),
                state: $('#state').val(),
                location: $('#location').val(),
                zipcode: $('#zipcode').val(),
                event_address: $('#event_address').val(),
                event_address2: $('#event_address2').val()
            },
            success: function (data) {
                $('#art_event_message').removeClass().addClass((data.error === true) ? 'error' : 'success')
                    .text(data.msg).show(500);
                if (data.error === true) {
                    if (data.goto == 1) {
                        delete json;
                    } else {
                        $('#artist_create_event').show(500);
                        delete json;
                    }
                }
                if (data.error === false) {

                    $('#artist_create_event').show(500);
                    delete json;
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                $('#art_event_message').removeClass().addClass('error')
                alert('The error was: ' + errorThrown);
                alert('The error was: ' + XMLHttpRequest);
                alert('The error was: ' + textStatus);
                //                  .text('response.Text').show(500);
                $('#artist_create_event').show(500);
            }
        });

        return false;
    }

});