Mark Drew (Redux)- cf_etc...

a compendium of railo, cfml, cfeclipse and technology topics

Mark Drew (Redux)- cf_etc...

Event Validation: Showing errors in your page

November 26, 2007 ·

In the previous post I introduced Event Validation, which on a simple level validates the input from forms in a Model-Glue request against a set of rules that you define in a ColdSpring tag. Simple so far? Well, its all very well getting a resultant ErrorCollection back from the server, but you will still need to display the errors, which is another load of work that the Event Validation plugin can help you with. To enable this you simply need to add two things to your view template, another cfimport (apart from the main mv one) and another attribute to your mv:setup tag:Lets import the form tag library : <cfimport prefix="" taglib="/EventValidation/taglib/form"> This tag, with the help of using a blank prefix, means you can replace html tags with custom tags, so your "input", "select" and "textarea" tags are no longer simple html tags, they are now super charged custom tags, that allow the EV framework to change the style and add error divs when required. To make anything appear though, we need to change our mv:setup tag: <ev:setup id="simpleValidation" showerror="true"> That wasn't so hard was it? Now, when the form is submitted, div's will appear below each form item that has an error, and will have some nice error descriptions. By default the input items will have the CSS class "error" added to them, of course, you might want to set your own style classes, this is just a part of the setup: <ev:setup id="simpleValidation" showerror="true" errorClass="myspecial_error"> And that is it to show the errors! View Demo

Tags: coldfusion · coldspring · EventValidation

6 responses

  • 1 Robb // Sep 22, 2008 at 4:13 PM

    Very cool MG plugin and it is great that you are using jQuery. The one issue I am wondering about is how to use other jQuery scripts in conjunction with your plugin on the same page with jQuery &quot;chaining&quot; and document.ready().

    Thanks
  • 2 robb // Sep 22, 2008 at 4:13 PM

    oops long day already I meant this:

    $(document).ready(function() {
    somefunction here;

    }
  • 3 Mark Drew // Sep 22, 2008 at 4:13 PM

    Well, you can add your own entry for $(document).ready(function(){}); and they will still run; I did some other tests which used that so you can have multiple .ready() functions. Shouldn't be an issue
  • 4 Neil Middleton // Sep 22, 2008 at 4:13 PM

    Ooh, jquery ;)
  • 5 Mark Drew // Sep 22, 2008 at 4:13 PM

    Yes yes, who got me addicted eh?! EH!?

    If course, I think there might be some more improvement in the js code, I could certainly implement more of the Jquery stuff...
  • 6 Tara // Sep 22, 2008 at 4:14 PM

    Hi Mark
    Loving the MG plug-ins, very elegant.

    I have a question, if I do not want the descriptions to be displayed under the input fields (but want the input box to styled) is the best way to do this via my custom CSS class. i.e. set .error_description to display: none. Or is there an automagically way to do this via the setup?