How to mark required field in jQuery Validate

Question

Hi

I'm using jQuery Validate and xVal to validate in input forms. This works great. However, I do want to mark my required fields with an asterix (*) or something like that to show which field is actually required.

I could do this by hand, but since I already generate my validation rules with xVal I thought I could mark the required fields automatically based on the provided rules.

Is there a way to hook into either xVal or jQuery Validate to retrieve the rules, or somehow make them mark my required fields?

I'm using the latest versions of jQuery and jQuery Validate.

Thanks

Answer 1

It is probably easiest to make a separate "rules" variable which you pass to both jQuery and some other function. This other function would loop through it and mark all required fields as such.

Answer 2

Give the class required to the form elements, and use the following code

$(document).ready(function() {
     $('<span style="color:red;">*</span>').insertAfter('.required');
});

This will attach "*" to every elements with required class

Hope it helps