i use this form
<div class="row">
<form class="col s12">
<div class="row">
<div class="input-field col s12">
<input id="email2" type="email" class="validate">
<label for="email2" data-error="wrong" data-success="right">Email</label>
</div>
<div class="input-field col s12">
<input id="example" name="example" type="text" class="validate" required="" aria-required="true">
<label for="example" data-error="wrong" data-success="right">Field</label>
</div>
</div>
</form>
</div>
mail field is ok. if I post in an incorrect mail address error message appears.
example field not work. i would check if field is not empty and then show error.
What's wrong?
To validate the form using HTML, we will use HTML <input> required attribute. The <input> required attribute is a Boolean attribute that is used to specify the input element must be filled out before submitting the Form.
The focusout() method in jQuery is used to remove the focus from the selected element. Now we will use focusout() method to validate the input field while focussing out. This method checks whether the input field is empty or not.
Use the condition with “” and NULL to check if value is empty. Throw a message whenever ua ser does not fill the text box value.
You forgot to add required=""
and aria-required="true"
here is the completes snippet:
<div class="row">
<form class="col s12">
<div class="row">
<div class="input-field col s12">
<input id="email2" type="email" class="validate" required="" aria-required="true">
<label for="email2" data-error="wrong" data-success="right">Email</label>
</div>
<div class="input-field col s12">
<input id="example" name="example" type="text" class="validate" required="" aria-required="true">
<label for="example" data-error="wrong" data-success="right">Field</label>
</div>
<div class="input-field col s12">
<button class="btn waves-effect waves-light" type="submit" name="action">Submit</button>
</div>
</div>
</form>
</div>
http://jsfiddle.net/u76rdq2h/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With