Error Messages not colored or placed properly
Hi all:
My experience with JQuery and PlugIns is limited so I apologize in advance for (probably) a quite basic question.
The page I am referencing is here:
http://www.communitycarestraining.com/registration.cfm
My question is about the error messages which are returned when a field is not inputted correctly.
Right now the error messages are plain black text and they butt up tight against the field box. I would prefer them to be colored red and put just under the field box in question.
As this is my first post I'm unsure what other information to give you. Here are a few items you may need, to give direction to solving my problem.
=================================
I have two files under my js folder, they are called:
jquery.validate.min
jquery-1.7.1.min
This is my javascript inside the page itself:
<script src="/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="/js/jquery.validate.min.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function() {
$("#registration").validate({
rules: {
FirstName: "required",
LastName: "required",
TelephoneNumber: "required",
WhereDoYouWork: "required",
WhereDoYouLive: "required",
TrainingFormat: "required",
Volunteer: "required",
Occupation: "required",
TrainingModules: "required",
Email: {
required: true,
email: true
},
ConfirmEmail: {
required: true,
equalTo: "#Email"
}
},
messages: {
FirstName: "Please enter your first name.",
LastName: "Please enter your last name.",
TelephoneNumber: "Please enter you telephone number.",
WhereDoYouWork: "Please tell us in which community you work.",
WhereDoYouLive: "Please tell us in which community you live.",
TrainingFormat: "Please choose a training format.",
Volunteer: "Please enter the agency or group you are with.",
Occupation: "Please tell us your occupation.",
TrainingModules: "Please select training modules.",
Email: {
required: "Please enter your email address.",
email: "Please enter a valid email address."
},
ConfirmEmail: {
required: "Please confirm your email address.",
equalTo: "The email address you provided does not match."
}
}
});
});
</script>
=================================
Feel free to press the submit button and you will see the error messages next to the field boxes. They are hard to see as they are black text.
Thanks so much for anyone trying to help me.
Daryl