This page contains information on the default XSLT's provided by Woody, and the wi:styling directives they support. Be sure to first read about the WoodyTemplateTransformer.

There are basically 3 XSLTs:

Additionally there are 2 XSLTs for advanced widget styling:

From the sitemap you only need to reference the last one, for example as follows:

  <map:transform src="context://samples/woody/resources/woody-samples-styling.xsl"/>

wi:styling options

wi:field (without selection list)

By default all attributes on the wi:styling element will be copied onto the resulting HTML <input> element. Thus you can put e.g. type, class, style and size attributes on it. For example:

<wt:widget id="myfield">
  <wi:styling size="50" class="kinky"/>
</wt:widget>

Some values for the type attribute will cause special effects:

Adding an attribute submit-on-change="true" on wi:styling will cause an automatic form submit when the field's value changes.

wi:field (with selection list)

By default, a field with a selection list is rendered as a dropdown box.

Adding an attribute list-type="radio" on wi:styling produces a vertical list of radio buttons instead. Add list-orientation="horizontal" to have a horizontal list of radio buttons.

Adding an attribute list-type="listbox" on wi:styling produces a selection list, use the attribute list-size to specify its size (default 5).

wi:action

By default, creates an <input> of type submit, thus showing a standard button. To have an image button instead, try this:

<wi:styling type="image" src="blah.gif">

Other widgets

Not yet documented here, but don't be afraid to look at the source of the woody-field-styling.xsl XSLT.

High-level styling with wi:group

No documentation yet, checkout the samples and the source of woody-page-styling.xsl.

For storing the state of a tab or choice selection server-side just add a field to the form definition that shall hold this value:

<wd:field id="state">
  <wd:datatype base="integer"/>
</wd:field>

Bind this value to whatever you want. In the form template you need then following code:

<wi:group>
  <wi:styling type="choice"/>
  <wi:state>
    <wt:widget id="state"/> <!-- refering to the above defined field -->
  </wi:state>
  <wi:items>
    ...
  </wi:items>
</wi:group>

Miscellaneous

wi:validation-errors

The wi:validation-errors tag is used to display all validation errors of all widgets in a form at one location, i.e. a the top of the form.

The wi:validation-errors tag must be a child of a wt:form-template element.

You can customise a message to be shown before and after the errors by adding a child header and/or footer element:

<wi:validation-errors>
  <header><p>Correct these errors please:</p></header>
  <footer><p>And then resubmit the form.</p></footer>
</wi:validation-errors>

WoodyXSLT (last edited 2009-09-20 23:41:03 by localhost)