GroovyMag Plugin Corner: JavaScript Validation Plugin
Posted by:
Dave Klein
on 2010-08-30 13:14:41.0
The following post is a reprint of the Plugin Corner article for the April 2009 issue of GroovyMag. You can find this and other past issues at http://groovymag.com.
Grails provides powerful and easy-to-use constraint validation. With a few short lines in a simple DSL, you can ensure that required fields are filled in or that numeric field values are within a specified range. If you take advantage of Grails’ scaffolding, error reporting is also handled for you. The only catch is that it’s server-side only. If you want this type of validation without a round-trip to the server, you’re on your own — unless you use Peter Delahunty’s brand new JavaScript Validation plugin.
Peter released the Javascript Validation plugin earlier in March and then went right to work improving it. At the time of this writing it is at version 0.7 and is working quite well. Let’s see how easy it can be adding client side validation to our Grails applications. We’ll start by installing the plugin:
We’ll need to make a couple changes to the views that we want validation on, but first let’s look at the domain class that we’ll be working with.
This simple
Open
The Validation plugin requires that our form contain a
Finally, we need to add the following line to the
Here we’re just using the minimum required attributes for the
Now if we go to create a new
Not bad for a couple lines of code. That’s just the basics. The
There is support for both domain classes and command objects. Errors can be displayed in a JavaScript alert (as shown in Figure 1), which is the default, or they can be shown in a list placed in a page element of our choosing, or we can even create custom error handling.
Currently only the following constraints are supported by the plugin:
This list is considerably shorter than the list of constraints that Grails provides, but as we can see by the 6 updates since its creation a few weeks ago, this plugin is being actively enhanced, so I wouldn’t be surprised to see more constraints supported soon.
Oh, and lest I forget, the Javascript Validation plugin works with Grails internationalization. So with a minor tweak to our
This plugin has great potential. It will already save significant development time in setting up client-side validation, and I’m sure it’s going to keep getting better. Stop by the Grails Plugin Portal and check it out. You can leave a comment with enhancement suggestions, or, if you’ve tried it out, let others know what you think with a rating. I’m giving it 5 stars!
Grails Plugin Portal page:
http://grails.org/plugin/javascript-validator
Peter Delahunty’s Blog:
http://blog.peterdelahunty.com
Grails provides powerful and easy-to-use constraint validation. With a few short lines in a simple DSL, you can ensure that required fields are filled in or that numeric field values are within a specified range. If you take advantage of Grails’ scaffolding, error reporting is also handled for you. The only catch is that it’s server-side only. If you want this type of validation without a round-trip to the server, you’re on your own — unless you use Peter Delahunty’s brand new JavaScript Validation plugin.
Peter released the Javascript Validation plugin earlier in March and then went right to work improving it. At the time of this writing it is at version 0.7 and is working quite well. Let’s see how easy it can be adding client side validation to our Grails applications. We’ll start by installing the plugin:
> grails install-plugin javascript-validation
We’ll need to make a couple changes to the views that we want validation on, but first let’s look at the domain class that we’ll be working with.
class Book {
String title
String author
Integer pages
static constraints = {
title(blank:false)
author(blank:false)
pages(range:10..1000)
}
}
This simple
Book class (bet you never saw that in an article before) has three constraints. We will use the JavaScript Validation plugin to check those constraints without a trip to the server.Open
grails-app/views/book/create.gsp and take a look at the <g:form> declaration. It should look something like this:
<g:form action=”save” method=”post” >
The Validation plugin requires that our form contain a
name attribute and an onSubmit attribute that calls the validateForm JavaScript function. So, let’s modify our form declaration to look more like this:
<g:form name=”bookCreate”
onsubmit=”return validateForm(this);”
action=”save” method=”post” >
Finally, we need to add the following line to the
<head> section of our page:
<jv:generateValidation domain=”book” form=”bookCreate”/>
Here we’re just using the minimum required attributes for the
<jv:generateValidation> tag. The domain attribute takes the domain class name, but with the first letter lowercase. The form attribute takes the same value that we assigned to the name attribute of our <g:form> tag. That’s all it takes to start using this plugin.Now if we go to create a new
Book and leave out the author’s name for some dumb reason, we’ll see something like the screenshot in Figure 1.
Not bad for a couple lines of code. That’s just the basics. The
<jv:generateValidation> tag has ten more attributes that we can use to add more vigor and vim to our validations.There is support for both domain classes and command objects. Errors can be displayed in a JavaScript alert (as shown in Figure 1), which is the default, or they can be shown in a list placed in a page element of our choosing, or we can even create custom error handling.
Currently only the following constraints are supported by the plugin:
blanknullableemailcreditCardmatchesrange
This list is considerably shorter than the list of constraints that Grails provides, but as we can see by the 6 updates since its creation a few weeks ago, this plugin is being actively enhanced, so I wouldn’t be surprised to see more constraints supported soon.
Oh, and lest I forget, the Javascript Validation plugin works with Grails internationalization. So with a minor tweak to our
messages.properties file, we can customize our error messages as shown in Figure 2.
This plugin has great potential. It will already save significant development time in setting up client-side validation, and I’m sure it’s going to keep getting better. Stop by the Grails Plugin Portal and check it out. You can leave a comment with enhancement suggestions, or, if you’ve tried it out, let others know what you think with a rating. I’m giving it 5 stars!
Resources
Grails Plugin Portal page:
http://grails.org/plugin/javascript-validator
Peter Delahunty’s Blog:
http://blog.peterdelahunty.com
These cobblestones were kicked down by Dave Klein.
Dave Klein's complete blog can be found at: http://dave-klein.blogspot.com
About Dave Klein
Dave is a consultant helping organizations of all sizes to develop applications more quickly (and have more fun doing it) with Grails. Dave has been involved in enterprise software development for the past 15 years. He has worked as a developer, architect, project manager, mentor and trainer. Dave has presented at user groups and national conferences. He is also the founder of the Capital Java User Group in Madison, Wisconsin, the Gateway Groovy Users in St. Louis, MO, and the author of Grails: A Quick-Start Guide, published by the Pragmatic Programmers. . Dave's Groovy and Grails related thoughts can be found at http://dave-klein.blogspot.com
More About Dave »NFJS, the Magazine
Plugging into Gradle Plugins
by Tim BerglundEnterprise Integration Agility
by Jeremy DeaneRelax with Couch DB
by Johnny WeySass...CSS Evolved
by Mark Volkmann