JavascriptValidator Plugin
-
Tags :
- Latest : 0.9
- Last Updated: 01 June 2009
- Grails version : 1.1 > *
Dependency :
compile ":javascript-validator:0.9"
Summary
Installation
Installation
Installation is very simple as is all grails plugin installations;grails install-plugin javascript-validator
Description
Javascript Validation Plugin
Overview
This plugin provides client side javascript validation for domain and command objects. The javascript validation is generated from the constraints closure. The client side javascript is all based on the apache commons validator javascript libs.Author: Peter Delahunty
blog: http://blog.peterdelahunty.com
twitter: http://twitter.com/peterdelahunty
email: peter.delahunty@gmail.com
Compatibility
The plugin is currently compatible with version 1.1.x of grails. I will look into making it backward compatible with 1.0x versions.Installation
Installation is very simple as is all grails plugin installations;grails install-plugin javascript-validator
Documentation
Usage of the javascript validator plugin is very simple. All you need to do is add the following gsp tag within the html head element of your page.Example tag:
<jv:generateValidation domain="book" form="bookForm"/>
Form tag
<form id="bookForm" name="bookForm" onsubmit="return validateForm(this);" action="">
Important! onsubmit attribute
You must also supply the onsubmit attribute on the form. This must call the validateForm function. Just copy the example above. If you don't do this then nothing will work :)Supported constraints
The following constraints are currently supported.blank
creditCard
matches
nullable
range
Important! If the blank constraint and the nullable constraint are both used for a String attribute then the blank constraint wins.
Attributes
The jv:generate tag has the following attributes:form:(required)
This is the name of the form you want to validate against.domain:(required for domain object validation)
This is the name of the domain object you want to generate validation against. This attribute is required if you want to generate validation for a domain object.command: (required for command object validation)
This is the full name of the command object. Eg if it is called SearchQueryCommand. Then the command attribute name is searchQueryCommand.controller: (required for command object validation)
Command objects are associated with controllers to you must supply the controller name that uses this command object.display:(optional)
Currently the plugin supports two options for displaying the validation error messages to the. These are alert and list.display=alert:
This is the default display type and will show a popup alert box with the error messages.display=list:
This will write the errors as ul (list) to the dom of the html page. To use this option you MUST also supply the container attribute.display=custom:
This will write the errors as ul (list) to the dom of the html page. To use this option you MUST also supply the container attribute.container(required for display type list)
This is the name of the container element (i recommend a div) where you want the html list of error written to.handler(required for display type custom)
This is the name of the function to call when validation errors are found. The function should take a single parameter.order:(optional)
This is a list of field names in the order you would like them displayed. This only works with the list and alert display options.ignore:(optional)
This is a list of field to ignore. Grails automatically creates nullable constraints for all attributes of a domain class. However you may not be setting them using the form so you can list the ones that you do not want to include in validation generation.disableSubmitButton:(optional)
This is the id of the form submit button. Once the form is validated it is and just before it will be submitted the submit button will be disabled. You MUST call the validateFormAndDisableSubmit method from the onsubmit action of your form for this to work.<g:form action="save" name="signUpForm" onsubmit="return validateFormAndDisableSubmit(this);">
useEmbeddedJquery:(optional)
This is used to turn off the embedded jquery lib. If you use the disableSubmitButton option above then the jquery lib is included automatically unless you supply this parameter and set it to false. If you do set it to false then you MUST supply your own copy of jquery on the page.examples
So here are some examples:1) Domain object Book with alert display
<jv:generateValidation domain="book" form="bookForm"/>
2) Domain object Book with list display
<jv:generateValidation domain="book" form="bookForm" display="list" container="errors"/>
3) Command object DemoCommand on demo controller with alert display
<jv:generateValidation command="demoCommand" controller="demo" form="demoForm" display="alert"/>
4) Command object DemoCommand on demo controller with list display
<jv:generateValidation command="demoCommand" controller="demo" form="demoForm" display="list" container="errors" ignore="['user','account']"/>
5) Command object DemoCommand on demo controller with list display
and ordering<jv:generateValidation command="demoCommand" controller="demo" form="demoForm" display="list" container="errors" order="['name','email']"/>
6) Command object DemoCommand on demo controller with custom display
<jv:generateValidation command="demoCommand" controller="demo" form="demoForm" display="custom" handler="myHandler" ignore="['user','account']"/><script type="text/javascript"> function myHandler(messagesMap) { for (fieldName in messagesMap) { alert( messagesMap[fieldName] ); } }; </script>
Important! Errors container recommendations
I recommend that you use a div for your error container element and that you auto hide it by default. The plugin will make it visible when displaying errors.<div id="errors" class="errors" style="display:none;"> </div>