jquery validate - validating a field on pageload

Question

Hi there, I've got an input field on my plain html form that I would like to be marked as invalid (and the error message shown) from the moment the page loads.

Is this possible to do with the jquery validate plugin?

Failing that, how can I hide an element when the plugin tries to validate a particular input field?

Answer 1

I think you would have to have the form you are validating be submit on the page load. Probably something like this:

   $(document).ready(function() {
       $('form').validate(/* set all of your validator options here */);
       $('form').trigger('submit');
    });

Answer 2

Managed to come up with a solution. It involved adding a 'dummy' validation element that is shown when the page is loaded. As soon as the user inputs a value into the corresponding field, the dummy element is hidden and the real one is shown.

I used the highlight and unhighlight options for the validate method to achieve what i wanted.

$("#myform").validate({
    highlight: function(element){
        if($(element).hasClass("math")){
           $(".temp").hide();
        }
    },

    unhighlight: function(element){
        if($(element).hasClass("math")){
           $(".temp").hide();
        }
    }
});

Maybe this will help someone else out in future.