OpenTranqueraFramework SourceForge.net Logo
Home
Features
Skin definition
Examples
Processor
Xkins Forms
Velocity
Struts
JSF
Downloads

Xkins Forms: Taglibs for making forms.

This example will show you a creation of a form using Xkins Forms.
This tags simplifies Xkins usage for creating forms integrated with Struts 1.1.

Xkins forms taglibs are:

  • frame: This will generate a frame for your form.
  • row: This tag inserts a row in the form. This must be nested in a frame. Rows are added to the frame and frame checks all rows to see if they have the equal in count of fields. If not, do the padding to complete the row.
  • field: This generates a label/input field. This must me nested in a row.
  • buttons: This tag holds all form buttons.
  • button: This is a button for the form.
  • execute: This is a button that executes a dispatch method to a Strut's Action.

Skin Components and Xkins Forms

This example will show how to create Skin Components and we will use Xkins Forms to render a form.
We will create four Skins: Primavera, Verano, Otono and Invierno. Each one can be packed in a single file and can be distributed independently.

Xkins-definition file

You declare here four Skin Components. Each one has an url (directory where elements and templates resides) and a definition.

<?xml version="1.0" encoding="UTF-8"?>
<xkins>
	<skin name="invierno" url="/skins/forms/invierno" definition="/definition.xml"/>
	<skin name="primavera" url="/skins/forms/primavera" definition="/definition.xml"/>
	<skin name="verano" url="/skins/forms/verano" definition="/definition.xml"/>
	<skin name="otono" url="/skins/forms/otono" definition="/definition.xml"/>
</xkins>

Skin Component definition file

We will show here default skin (invierno) for examples purpouses. This file will reside in /skins/forms/invierno directory, as this is skin's url declared in the previous xkins-definition file.
Click here to see the file.
Here you have to declare all templates needed by Forms Tags. these templates are:
frame, frameFooter, frameMandatoryCaption, field, fieldLabel, fieldInput, row, fieldPadding, nestedField, buttons and button.
You must also declare a constant named fieldColspan.
If you want to write your own Skin for using with Xkins Forms, you can extend one of these Skins and modify whatever you need.

JSP Code (using Xkins Forms)

This JSP code uses Xkins Forms taglib and renders a form for our example. We will include this JSP 4 times, each one with a diferent Skin, in order to see all together in the same page.

<forms:frame key="Please fill in this information">
	<forms:row>
		<forms:field key="Skin name">
			<xkins:xkinName/>
		</forms:field>
	</forms:row>
	<forms:row>
		<forms:field key="Last Name">
			<input type="text" size="30">
		</forms:field>
		<forms:field key="First Name">
			<input type="text" size="30">
		</forms:field>
	</forms:row>
	<forms:row>
		<forms:field key="Street">
			<input type="text" size="30">
		</forms:field>
		<forms:field>
			<forms:field key="Number">
				<input type="text" size="4">
			</forms:field>
			<forms:field key="Floor">
				<input type="text" size="2">
			</forms:field>
			<forms:field key="Dpt">	
				<input type="text" size="2">
			</forms:field>
		</forms:field>
	</forms:row>
	<forms:row>
		<forms:field key="City">
			<input type="text" size="30">
		</forms:field>
	</forms:row>
	<forms:row align="right">
		<forms:field>
			<forms:field key="ZIP">
				<input type="text" size="8">
			</forms:field>
			<forms:field key="Telephone">
				<input type="text" size="10">
			</forms:field>
		</forms:field>
	</forms:row>
	<forms:buttons>
		<forms:button key="OK" onclick="alert('OK');" 
			confirmMessage="¿Are you sure?" default="true"/>
		<forms:button key="return" gotoLocation="/index.jsp" 
			cancel="true"/>
	</forms:buttons>
</forms:frame>

Screenshots

The following image is an example of four Skins (primavera, verano, otono and invierno) using the same JSP. As you can see, each one looks completly different to the other.



Print version | Download | Powered by SourceForge.net