CODEWITHSUNDEEP
jqueryhtmlvalidation
DD77
DD77

Reputation: 1427

Jquery html5 validation with error messages

I need to show the error message based on input error. what I'm doing wrong?

also the error should be displayed when the h5validation adds the class .ui-state-error

if ($(".ui-state-error").is(":visible") == true) { find errors and display input:email

 <section class="errors">
   <p class="email"><span>Please enter a valid Email.</span></p>
   <p class="password"><span>Please re-type your password.</span> Your passwords didn't match.</p>
   <p class="repeat-password"><span>Please re-type your password.</span> Your passwords didn't match.</p>
 </section>

http://jsfiddle.net/hsSru/21/

Upvotes: 1

Views: 2427

Answers (2)

Eric Hamilton
Eric Hamilton

Reputation: 31

What you're trying to do is built-in to h5Validate. You don't need to do anything special to show and hide your errors, but you do need to give the errors ids instead of classes.

errorAttribute An html attribute that stores the ID of the error message container for this element. It's set to data-h5-errorid by default. Note: The data- attribute prefix is a new feature of HTML5, used to store an element's meta-data. e.g:

<input data-h5-errorid="email" type="text" class="h5-email" required />


<section class="errors">
    <p id="email"><span>Please enter a valid Email.</span></p>
</section>

See new fiddle: http://jsfiddle.net/hsSru/33/

See the documentation: http://ericleads.com/h5validate/

FYI, h5Validate supports both callbacks and an events API, as well as an allValid method.

Upvotes: 3

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

The first thing you need to take a look at is how you call the .live() method. .live() does not take a function as the first parameter, it takes the event you want it to listen for as the first parameter and the function as the second paramter, so that will likely cause you some trouble. Also, since jQuery 1.7, .live() is deprecated in favor of .on().

If you want the function to be called on submit, which is probably the most common, then you should use .submit() instead of .live().

Upvotes: 1

Related Questions