Book Image

Mastering jQuery

By : Alex Libby
Book Image

Mastering jQuery

By: Alex Libby

Overview of this book

<p>Mastering jQuery has been written not only to help maximize your skills with core functionality in the library, but also to explore some of the more intriguing ways of using the library to achieve real-world solutions that could feature on any website or online environment.</p> <p>You'll start with a look at some of the more advanced ways to incorporate the library into your pages, followed by working with forms and advanced form validation using regular expressions. Next you'll move on to animating in jQuery, advanced event handling, and using jQuery effects.</p> <p>Finally, you will develop practical examples of using jQuery with external functionality such as node-webkit, before finishing with a session on optimizing your version of the library for maximum efficiency and exploring best practices for using QUnit.</p>
Table of Contents (21 chapters)
Mastering jQuery
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Using jQuery to validate our forms


In some cases, using HTML5 validation will fail if an input type used is not supported in that browser; this is the time when we need to revert to using JavaScript, or in this case jQuery. For example, date as an input type is not supported in IE11, as shown here:

<input type="date" name="dob"/>

This is how the preceding code will be rendered:

<input type="text" name="dob"/>

The trouble is that with the type falling back to text, browsers will not correctly validate the field. To get around this, we can implement a check using jQuery—we can then start adding some basic validation using jQuery, which will override the existing native HTML checks made in the browser.

Let's take a look at how we can achieve some of this in practice, with a simple demo, as follows:

  1. Open up a copy of basicform.html from the code download that accompanies this book.

  2. In the <head> section, add a link to jQuery along with a link to your validation script:

    <script src...