Sumit Kumar
Sumit Kumar

Reputation: 66

jQuery Validator Hide error messages

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

Answers (3)

mpccolorado
mpccolorado

Reputation: 827

I struggled with the same problem and this is one way for doing that: display validator messages

Hope that helps

Upvotes: 0

Jahan Zinedine
Jahan Zinedine

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

Dejan Marjanović
Dejan Marjanović

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

Related Questions