Reputation: 66
How can we hide the error messages and show only the X sign/image and on mouse over we show the error message? There is a success handler in Validator but no failed handler? which we can use to edit the generated label?
I am trying to achieve this: http://screencast.com/t/Bo3QO8SQ (Screenshot)
A check mark for the success and X for failed fields. Right now not able to hide the message.
Upvotes: 1
Views: 1103
Reputation: 827
I struggled with the same problem and this is one way for doing that: display validator messages
Hope that helps
Upvotes: 0
Reputation: 14874
Make your own js messages file and add reference to it, jquery validation plugin use it instead of the default messages.
Like what I've done in messages_fa.js
jQuery.extend(jQuery.validator.messages, {
required: "<br/>*",
remote: "<br/>لطفا اين مورد را تصحيح كنيد",
email: "<br/>لطفا ايميل را تصحيح كنيد مانند [email protected]",
url: "<br/>لطفا آدرس را تصحيح كنيد",
date: "<br/>لطفا تاريخ را تصحيح كنيد",
dateISO: "<br/>لطفا تاريخ را تصحيح كنيد",
number: "<br/>لطفا عدد را تصحيح كنيد",
digits: "<br/>لطفا فقط عدد وارد كنيد",
equalTo: "<br/>لطفا مقدار را عينا وارد كنيد",
accept: "<br/>لطفا با پسوند معتبر وارد كنيد",
maxlength: jQuery.format("<br/>لطفا بيش از {0} حرف/رقم وارد نكنيد"),
minlength: jQuery.format("<br/>لطفا كمتر از {0} حرف/رقم وارد نكنيد"),
rangelength: jQuery.format("<br/>لطفا بين {0} و {1} حرف/رقم وارد كنيد"),
range: jQuery.format("<br/>لطفا مقدار بين {0} و {1} وارد كنيد"),
max: jQuery.format("<br/>لطفا مقدار بزرگتر از {0} وارد نكنيد"),
min: jQuery.format("<br/>لطفا مقدار كوچكتر از {0} وارد نكنيد")
});
then your aspx or masterpage would be like this
<script src="../Scripts/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery.validate.pack.js" type="text/javascript" charset="ISO-8859-1"></script>
<script src="../Scripts/messages_fa.js" type="text/javascript"></script>
Upvotes: 1
Reputation: 19380
There is no universal solution, you have to show your form. You can do that manually using .blur,.show,.hide,.focusout,.mouseout functions.
Upvotes: 0