Forms

 Top Previous Topic Next Topic  Print this topic

The control types supported by the xf:form extension are:

 

·button - push button
·text - allows typing in a text using the keyboard; can be "one-line" or "multiline"
·checkbox - toggle (on / off) button
·radiobutton - toggle (on / off) button, contained in a group, that allows the user to choose exactly one option from a predefined set
·submit - a special type of button which submits the form control's data

 
An xf:form contains one of more xf:form-control elements. Both form and form-control elements can be nested inside fo:block and fo:inline elements.

 

Example of usage:

 

 

<xf:form>

   <!--Button-->

   <xf:form-control name="ButtonName" type="button" value="ButtonText">

       <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

 

   <!--Text edit-->

   <xf:form-control name="TextEditName" type="text" multiline="true | false" value="DefaultText">

       <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

 

   <!--Checkbox, initially checked-->

   <xf:form-control name="CheckBoxName" type="checkbox" checked="true | false" value="ValueToSubmitWhenChecked">

       <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

 

   <!--Radio button group-->

   <xf:form-control name="RadioGroup" type="radiobutton" checked="true | false" value="ValueToSubmitWhenSelected">

   <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

   <xf:form-control name="RadioGroup" type="radiobutton" checked="true | false" value="ValueToSubmitWhenSelected">

   <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

   <xf:form-control name="RadioGroup" type="radiobutton" checked="true | false" value="ValueToSubmitWhenSelected">

   <!--One or more actions-->

       <xf:form-action action-type="JavaScript" event="Event" annotation-reference="AnnotationId">

       ...

   </xf:form-control>

</xf:form>

 

 

 

The following attributes can be applied:

 

Name

Type

Possible values

Default

Description

value

String

 

 

- for button specifies the caption

- for text specifies th default text to be displayed

multiline

Boolean

-

false

Used for a multiline text form

editable

Boolean

-

true

Used for a multiline text form

checked

Boolean

-

false

Used for a check-box form

password

Boolean

-

false

Text form is a password field

max-chars

int

-

0

Sets the maximum characters count for a text field

url

String

-

“”

Defines an address for a submit button

control-style

enum

default

flat

default

Defines the display method for any form.

check-style

enum

check

check

circle

cross

diamond

square

star

Check-box form type style

event

 

 

 

Available values:

·OnMouseUp - triggered after the control was left-clicked and the button is released
·OnMouseDown - triggered when the control is left-clicked and the button is held
·OnMouseEnter - triggered when the mouse cursor enters the form area
·OnMouseExit - triggered when the mouse cursor leaves the form area
·OnFocus - triggered when the control gets focus
·OnBlur - triggered when the control loses focus

 

 

One or more actions can be associated with a control. Each action nested in a form control whose event is triggered is executed. The JavaScript code to execute is nested in the annotation referenced by the annotation-reference attribute of the xf:form-action element.

 

Example of usage, with embedded JavaScript code:

 

 

<xf:annotation id="6">

       <xf:javascript output-type="pdf">

               app.alert("This is a JavaScript alert.");

       </xf:javascript>

       <xf:javascript output-type="html">

               alert("This is a JavaScript alert.");

       </xf:javascript>

</xf:annotation>

 

 

The JavaScript Code annotation can be accessed for more information on how to include JavaScript into output documents.

 

Styling controls is supported by using the standard fo:color and fo:background-color attributes. Their effects are as follows: fo:color applies the text and border's color, and fo:background-color sets the button's background.

 

Also, the forms can have borders defined using fo:border-*-style and fo:border-*-color, where * can be replaced by top, left, right, bottom.