FForm Documentation

Author: Martijn de Visser - http://www.martijndevisser.com
Last Modified: 12/05/03 14:52:18


Summary

FForm Class:

- description

FForm Properties:

- source
- triggers
- name

FForm Methods:

- addEventListener
- addTrigger
- removeTrigger
- getValue
- setValue
- refresh


FForm class

version: 0.5.1

description:

The FForm class allows you to generate dynamic forms, based on xml files.

The main idea behind FForm idea is that you can specify (nested) form elements, which are shown based on user input. So, for example, a checkbox could have three inputfields as it's children. The inputfields aren't shown, until the user enables the checkbox. That way, you can easily create expanding and contracting forms, dynamically reacting on user input.

The XML file requires the following structure:

	<form>
		<element class="FFormLabel" />
		<element class="FFormCheckBox">
			<element class="FFormLabel" />
			<element class="FFormLabel" />
		</element>
	</form>
	
Possible attributes for the <form> tag are: Possible attributes for the <element> tags are: All other attributes will be added to a single object. This object will be passed to the component during initialization. Use this for setting parameters such as labels, colors, fonts, checked states, etc.

A more complete sample is shown below:

	<form indent="30">
	<element class="FFormLabel" id="about" hspace="5" vspace="2" color="0x008BCE" width="300" size="14" font="verdana" label="This is the content of 'simple.xml'..." />
	<element class="FFormCheckBox" id="checkBox_01" label="A checkbox" selected="true" hspace="5" vspace="2">
		<element class="FFormLabel" id="label_A" hspace="5" vspace="2" color="0x999999" width="300" size="8" font="harmony" embed="true" label="This is some additional text, which is shown when activating the CheckBox. This element is a label, acting as a child of the CheckBox." />
		<element class="FFormInput" id="input_A" hspace="5" vspace="2" color="0x124178" width="300" size="10" background="0xA5C8F1" border="0x124178" label="This text is editable..." />
		<element class="FFormInput" id="input_B" hspace="5" vspace="2" color="0x124178" width="300" size="10" background="0xA5C8F1" border="0x124178" label="This text is editable..." />
	</element>
	</form>
	

usage:

The following creates a form with instancename "myformname", in the current movieclip at level 2, position 50,50.
The contents of the form will be based on the xml file named myForm.xml. Specify a full URL to load XML files from another location.
myForm = new FForm("myformname", "myForm.xml", this, 2, 50, 50)

parameters:


FForm Properties:

source

(String) Sets or gets the xml file source. Use FForm.load() to actually load the xml file.

triggers

(Array) Sets or gets the elements which trigger a redraw of the form, replaces the current list.

name

(String) Returns the form name (is also the instancename). Cannot be set.


FForm Methods:

addEventListener

description: The following standard EventDispatcher events are broadcasted by FForm:

data, indicates a change in the form contents. This event object contains the following properties: layout, indicates a change in the form layout. This event object contains the following properties: error, indicates an XML error. This event object contains the following properties:

usage: FForm.addEventListener(event, listener)

parameters:

returns: Nothing.

addTrigger

description: Adds a class name to the list of elements that may change the form layout.
Default values are: FFormCheckBox, FFormRadioButton, CheckBox, RadioButton

usage: FForm.addTrigger( class )

parameters:

returns: Nothing.

removeTrigger

description: Removes a class name from the list of elements that may change the form layout.

usage: FForm.removeTrigger( class )

parameters:

returns: Boolean, true if successfullly removed, false when the class name was not found.

getValue

description: Returns the value of specified form element, or, if no element name is given, the value of all form elements.
FForm needs to access a property named "value" in each element to accomplish this, so make sure this getter function is implement when creating custom components for FForm.

usage: FForm.getValue( element )

parameters:

returns: Object, containing all form elements as properties with their respective value.

setValue

description: Sets the value of a specific form element.
FForm needs to access a property or getter/setter named "value" in each element to accomplish this, so make sure this property is available when creating custom components for FForm.

usage: FForm.setValue( element )

parameters:

returns: Nothing.

refresh

description: Redraws the complete form.

usage: FForm.update()

returns: Nothing.




generated with AS2docGenerator beta 0.5