Question

I am wondering if something like this is posible

.validate({
    rules: {
        email: {
                    required: true,
                    email: true
                }
            },

messages: {
    email: {
            required: "<?php echo get_texto_clave('error_validate_empty'); ?>",
            email: 'Please enter a valid email address',
            whenFieldIsValid: 'looks good'
        }
    }
});

To show a message, not error but a confirmation that the input is valid,

how can i do so?

Answer 1

You can use the validClass option to write this functionality. When an input is valid, the plugin will add a specified class to that element.

Insert a hidden div after each of the inputs:

<input id="exampleinput" /><div class="correctmessage">Looks Good</div>

To hide:

.correctmessage{ display: none; }

In your validate statement, include the validClass option, as well as onkeyup and onclick if you want the messages to appear as changes are made to the form:

.validate({
    validClass: "success",
    onkeyup: true,
    onclick: true
})

Then CSS to display the first element of class correctmessage after a success class (the specificity should override the other CSS block):

.success + .correctmessage{ display: block;}

display: inline is also valid.