jQuery Form Validation Plugin - Validate Forms Easily
•Download as ODP, PDF•
0 likes•2,215 views
The jQuery Form Validation Plugin allows for simple client-side form validation. It includes a set of built-in validation methods like required, email, minlength, and maxlength. The goal of the plugin is to improve the user experience when filling out forms by providing validation and error messages. It is meant to be used alongside server-side validation for security. The document provides an example of using the required method and discusses integrating the plugin with the Play Framework.
Recommended
More Related Content
What's hot
Viewers also liked
Viewers also liked (20)
Similar to jQuery Form Validation Plugin - Validate Forms Easily
Similar to jQuery Form Validation Plugin - Validate Forms Easily (20)
More from Knoldus Inc.
More from Knoldus Inc. (20)
Recently uploaded
Recently uploaded (20)
jQuery Form Validation Plugin - Validate Forms Easily
- 1. jQuery Form Validation Plugin Anand Kumar Singh Software Consultant Knoldus Software LLP Email- anand@knoldus.com
- 2. Agenda ➢ Why jQuery Form Validation? ➢ Goal of jQuery Form Validation. ➢ All built-in Validation methods. ➢ Example ➢ Integration with Play Framework
- 3. jQuery Form Validation ➢ This jQuery Plugin makes simple client side form validation easy. ➢ It makes a good choice if you’re building something new from scratch. ➢ The Plugin comes bundled with a useful set of validation methods. ➢ All bundled methods come with default error messages in English and translations into 37 other languages.
- 4. Goals The ultimate goal of this plugin is to make working with forms more fun for everyone. By improving the interaction, it is easier and less annoying for the user to fill out the form and submit it. To achieve this, it is important that the plugin is actually deployed on websites around the world, so a lot of focus is spent on making it easy for developers – that's you – to use the plugin. The plugin can never replace server side validation and doesn't intend to do so. Having both in place gives you the necessary security for your application, as well as improved usability.
- 5. List of built-in Validation methods A set of standard validation methods is provided: ➢ required – Makes the element required. ➢ remote – Requests a resource to check the element for validity. ➢ minlength – Makes the element require a given minimum length. ➢ maxlength – Makes the element require a given maxmimum length. ➢ rangelength – Makes the element require a given value range. ➢ min – Makes the element require a given minimum. ➢ max – Makes the element require a given maximum. ➢ range – Makes the element require a given value range. ➢ email – Makes the element require a valid email ➢ url – Makes the element require a valid url ➢ date – Makes the element require a date. ➢ dateISO – Makes the element require an ISO date. ➢ number – Makes the element require a decimal number. ➢ digits – Makes the element require digits only. ➢ creditcard – Makes the element require a credit card number. ➢ equalTo – Requires the element to be the same as another one
- 6. Some more methods are provided as add-ons, and are currently included in additional-methods.js in the download package. ➢ accept – Makes a file upload accept only specified mime-types. ➢ extension – Makes the element require a certain file extension. ➢ phoneUS – Validate for valid US phone number.
- 7. Example <html> <head> <title>Makes "field" always required. Nothing and blanks are invalid.</title> </head> <body> <form id="myform"> <label for="field">Required: </label> <input type="text" class="left" id="field" name="field"> <input type="submit" value="Validate!"> </form> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script> <script src="http://jquery.bassistance.de/validate/additional-methods.js"></script> <script> $( "#myform" ).validate({ rules: { field: { required: true } } }); </script> </body> </html>
- 8. Integration with Play Framework ● ● ● ● The live application is currently hosted at : http://jqueryformvalidation.herokuapp.com/ The Github code for the project is at : https://github.com/knoldus/jQuery-form-validation Clone the project into local system Install play if you do not have it already. You can get it from here: http://www.playframework.com/download ● Execute play compile to build the product ● Execute play run to execute the product ● jQuery Form Validation should now be accessible at localhost:9000
- 9. References ● ● jQuery Form Validation Plugin :http://jqueryvalidation.org/documentation/ Play Framework Form Helpers :http://www.playframework.com/documentation/2.1 .3/ScalaFormHelpers