how to bypass jQuery form validator when a certain button inside the form is clicked

Question

Hey guys with this line of code I enable the jQuery validator to validate certain form fields.

<script>
$(function() 
{
    $( "#date").datepicker( {autoSize: true, dateFormat: 'yy/mm/dd', showAnim: 'show' } );
});
$(function() 
{
    $( "#starttime, #stoptime, #starttime2, #stoptime2, #starttime3, #stoptime3, #starttime4, #stoptime4" ).timepicker( {autoSize: false, showAnim: 'show' } );
}); 
</script>

<script>
    $(function() {
        $("#productionlogform").validate({
            rules:  {
                date:   {
                    required: true,
                },
                starttime:  {
                    required: true,
                },
                stoptime:   {
                    required: true,
                }
            }
        });
    });
</script>   

As you see, date, starttime and stoptime are required, therefore the form can not be posted before it's set.

Now this is VERY annoying if I have a delete button in my form...

Any idea's how to allow that button to bypass the validation rules?

Answer 1

Also, don't forget to validate on the server side as well. Client-side validation should never, ever, EVER, be relied upon to prevent people entering bad/malicious data.

Answer 2

Sorry Bhavik Shah that I can not accept your answer, but anyway, the validationEventTrigger did the job. Rewrote my code and looks like this:

<script>
    $(function() {
    $("#deleteproductionlog").click(function () { 
        $("#productionlogform").validate().cancelSubmit = true;
    });
    $("#newproductionlog").click(function () { 
        $("#productionlogform").validate().cancelSubmit = true;
    });         
        $("#productionlogform").validate({
            rules:  {
                date:   {
                    required: true,
                },
                starttime:  {
                    required: true,
                },
                stoptime:   {
                    required: true,
                }
            },
        });     
    });
</script>

The button named "deleteproductionlog" and "newproductionlog" will skip the validation of the form, which is called "productionlogform".