I've created a mock-up of how JS constraints could work.
The demo form has 2 fields, equivalent to:
---
elements:
- type: text
name: text1
filters:
- TrimEdges
constraints:
- Required
- type: text
name: text2
filters:
- TrimEdges
constraints:
- Required
- Integer
The error checking in the demo is done both at 'onblur' and 'onsubmit'.
The client-side error messages use the exact same markup and css as
server-side error messages, so the user won't know any difference.
If you try submitting the form while there's errors, the
'form_error_message' is displayed at the top of the form and the
submission is cancelled.
The error messages are hidden/displayed by mangling their class-names.
All error messages are written to the page using javascript, so if the
user has JS disabled, they won't see any error messages when the page
first loads, and the form will be submitted to the server as normal.
Please have a play about with it, and give feedback:
http://www.fireartist.com/tmp/client-side-constraint.html
At the moment, this isn't actually implemented in HMTL-FormFu, I've
just edited the HTML created by it and added some javascript.
There's still work needing done to figure out how to play nicely with
constraints which can't be run client-side.
It's implemented using Dojo, because trying to write cross-browser JS
otherwise is a pig - but I'd prefer to eventually get it working with
having to load an external JS library.
I envisage filters being able to run at 'onchange', 'onblur' and 'onsubmit'.
Constraints probably just at 'onblur' and 'onsubmit'.
And inflators, validators and transformers won't be run client-side.
Carl
_______________________________________________
Html-widget mailing list
Html-widget@lists.rawmode.org
http://lists.rawmode.org/cgi-bin/mailman/listinfo/html-widget
