Thursday, October 12, 2006
Forms in EJAX
Forms in EJAX are either the normal HTML controls or XForms controls. The former can of course be created by any designer, the latter will probably need a programmer with an HTML editor. XForms controls are translated to HTML controls through the final pass with ejax_page_formatter.xsl.
To display controls with data in it, an application could create HTML output with controls with value statements. But that violates the EJAX principle of separation of concerns: HTML code should be separate from data as much as feasible.
This problem is solved within XForms as well. The idea is to bind controls, through an XPath statement, to an instance. When the EJAX page formatter style sheet formats an HTML page, it basically copies the HTML nodes to the output. And does something special in certain cases. If the HTML control has an id element, the page formatter checks to see if there is a response with the same id as the form (and with type = 'model') and if the contents is an XForms model. If so, it will check if this model as a bind statement with an id equal to the id of the control. If so, it will use the specified XPath statement to select the data from the also supplied xforms:instance element.
EJAX also has support for other attributes that can be specified with an xforms:bind element such as if the control should be readonly. If so, it sets the readonly attribute.
It would be much easier of course if all browsers would support XForms out of the box. This probably won't happen. So XForms has to be emulated somehow. It is probably possible to emulate XForms with JavaScript, but that might lead to significant initial download times as also an XSL JavaScript implementation has to be provided. So EJAX emulates XForms as much as possible at the server side, emitting pure HTML as output.
And we end up with a system where we have achieved separation of concerns: the HTML can be maintained and touched outside the hand of programmers (within certain limitations of course), and the HTML is connected to the data by passing in an instance with the XML representation of the data and the bind statements to select the appropriate values from this instance.
To display controls with data in it, an application could create HTML output with controls with value statements. But that violates the EJAX principle of separation of concerns: HTML code should be separate from data as much as feasible.
This problem is solved within XForms as well. The idea is to bind controls, through an XPath statement, to an instance. When the EJAX page formatter style sheet formats an HTML page, it basically copies the HTML nodes to the output. And does something special in certain cases. If the HTML control has an id element, the page formatter checks to see if there is a response with the same id as the form (and with type = 'model') and if the contents is an XForms model. If so, it will check if this model as a bind statement with an id equal to the id of the control. If so, it will use the specified XPath statement to select the data from the also supplied xforms:instance element.
EJAX also has support for other attributes that can be specified with an xforms:bind element such as if the control should be readonly. If so, it sets the readonly attribute.
It would be much easier of course if all browsers would support XForms out of the box. This probably won't happen. So XForms has to be emulated somehow. It is probably possible to emulate XForms with JavaScript, but that might lead to significant initial download times as also an XSL JavaScript implementation has to be provided. So EJAX emulates XForms as much as possible at the server side, emitting pure HTML as output.
And we end up with a system where we have achieved separation of concerns: the HTML can be maintained and touched outside the hand of programmers (within certain limitations of course), and the HTML is connected to the data by passing in an instance with the XML representation of the data and the bind statements to select the appropriate values from this instance.
posted by Berend de Boer @ 22:19 
