Ajax Validation

Validation servlet vs Interceptor

• Using a validation servlet requires the app developer to map any servlet filters for any action that is to be validated to the validation servlet as well.
• Using a validation interceptor executes the validation within the context of any mapped servlet filters, as well as within the context of the action.

Custom Ajax code or Third Party Library

• The DOJO Toolkit promises to be a very flexible and powerful toolkit, however they are only in the beginning stages. A lot of the code is coming from other dhtml toolkit projects that are very mature.
• We only require a fairly simple xmlhttp layer a the moment. Dojo have released their dojo.io.bind package http://dojotoolkit.org/intro_to_dojo_io.html which should be sufficient for us, however I think we can produce our own XmlHTTP code for now.
• I have implemented some custom xmlhttp / javascript code http://www.drivelater.com.au - do a search. It works in IE and FireFox.

JavaScript API

• In WW CVS /src/webapp/validationServlet.js contains a sample ValidationServlet client javascript class. It handles the communication with the validation servlet, and exposes callbacks for handling the errors. NOTE : I think we can re-work this a bit. I currently have lots of onWhatever callbacks. I think we should just have onErrors, and let the template designer do what they want with the Errors object.
  • Sample Usage

    var validation = new ValidationServlet('/validationServlet/client.js');
    validation.onErrors = function(inputObject, errors) {
    	// clear old errors
    	// display new errors
    }

  • The errors param for the onErrors callback is a javascript object that has this structure

    class Errors {
    	String[] actionErrors;
    	Map<String, String[]> fieldErrors; // fieldName is the key
    }

• See this in action in WW cvs head

   
  /src/java/templates/xhtml/validation.vm
  /src/webapp/validationServlet.js
  /src/webapp/javascript-input.jsp
  

• Cloves' provided example API :

  function addActionErrors(messages); // should messages be an array?!
  function addFieldErrors(fieldName, messages); // should messages be an array?!
  function clearActionErrors();
  function clearFieldErrors(fieldName);
  function clearErrors(formName);

New Theme

• We need to develop a new slick looking template based on css that has full client side javascript support.
• We could mix some ideas from
  • http://www.themaninblue.com/experiment/InForm/margin.htm
  • http://www.baekdal.com/articles/Usability/usable-XMLHttpRequest/