The ability to easily generate interactive PDF and Open Document interactive forms is one of the distinctive characteristics of Docxpresso.

The generated forms support:

  • text input fields,
  • select menus,
  • checkboxes,
  • rabio buttons,
  • text areas and
  • submmit buttons.

All this elements may be combined at will and all the collected information may be sent directly via an http connection to a remote web server or simply saved by the user in the current document.

Forms are only supported by PDF and Open Document (.odt) output formats. This is no limitation of Docxpresso but of the standards behind Word and RTF formats.

Beware that you may also generate your forms using Docxpresso extended HTML5 code: Advanced document components via extended HTML5.

Form wrapper

if we want that our form elements are grouped within a single form wrapper (so they can be further processed) we need to use the core form method which public API is given by:

Signature

public form ([$options])

Parameters

  • $options (type: array). This array has the following available keys and values:

    • name (type: string), a unique name that identifies the form. If not given will be automatically generated.
    • target (type: string, default: _blank). It can be _blank, _self, _top or a frame name.
    • action (type: string). points to the URL (if any) where the data of the form should be sent and processed.
    • method (type: string, default: get). It may take the values get or post.

Notice that the core form method itself does not admit any styling. If you wish to globally style a form you should embedd it in an element that accepts styling itself (table, textbox, etcetera).

Before getting into practical examples let us introduce the API of the standard form elements so we can offer a somehow more realistic sample code.

Input fields

The input fields of Docxpresso roughly correspond to the standard HTML input form elements.

The core method responsible of inserting an input element within a document is the form method which public API is given by:

Signature

public inputField ([$options])

Parameters

  • $options (type: array).
    This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated with the latest available created form.
    • name (type: string), a unique name that identifies the element. If not given will be automatically generated.
    • value (type: string). The input field default value, if any.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The relevant CSS style type styles that one may apply to an input field include (where ‘*’ in this context stands for top, right, bottom or left).

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Text:
    • font: shorthand for font properties.
    • font-family: sets the font to be used.
    • font-size: sets the font size.
    • font-style: sets the font style.
    • font-variant: sets the font variant.
    • font-weight: specifies how thick the characters should be displayed.
    • font-kerning: specifies the kerning information.
    • letter-spacing: increases or decreases the separation among characters in the text.
    • color: sets the font color.
  • Borders (individual borders are not supported):
    • border: shorthand for border properties.
    • border-color: sets the border color.
    • border-style: sets the border line style.
    • border-width: sets the border width.
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Checkboxes

The checkboxes of Docxpresso roughly correspond to the standard HTML checkbox form elements.

The core method responsible of inserting a checkbox element within a document is the checkbox method which public
API is given by:

Signature

public checkbox ([$options])

Parameters

  • $options (type: array).
    This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated with the latest available created form.
    • name (type: string), a unique name that identifies the element. If not given will be automatically generated.
    • value (type: string). The checkbox value.
    • checked (type: boolean, default: false).
      The checkbox state.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The styling possibilities of checkboxes are currently limited to its (bounding box) sizing and display properties:

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Radio butons

The radio buttons of Docxpresso roughly correspond to the standard HTML radio button elements.

The core method responsible of inserting a radio button element within a document is the radioButton method which public
API is given by:

Signature

public radioButton ([$options])

Parameters

  • $options (type: array).
    This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated with the latest available created form.
    • name (type: string), a unique name that identifies the element. All radio buttons belonging to the same radio group
      should share the same name.
    • value (type: string). The radio button value.
    • selected (type: boolean, default: false). The radio button state.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The styling possibilities of checkboxes are currently limited to its (bounding box) sizing and display properties:

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Text areas

The text area elements of Docxpresso roughly correspond to the standard HTML textarea form elements.

The core method responsible of inserting an input element within a document is the textarea method which public API is given by:

Signature

public textarea ([$options])

Parameters

  • $options (type: array). This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated
      with the latest available created form.
    • name (type: string), a unique name that identifies the element. If not given will be automatically generated.
    • scroll (type: boolean, default: true). If true the text area shows vertical scrollbars.
    • value (type: string). The input field default value, if any.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The relevant CSS style type styles that one may apply to an input field include (where ‘*’ in this context stands for top, right, bottom or left).

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Text:
    • font: shorthand for font properties.
    • font-family: sets the font to be used.
    • font-size: sets the font size.
    • font-style: sets the font style.
    • font-variant: sets the font variant.
    • font-weight: specifies how thick the characters should be displayed.
    • font-kerning: specifies the kerning information.
    • letter-spacing: increases or decreases the separation among characters in the text.
    • color: sets the font color.
  • Borders (individual borders are not supported):
    • border: shorthand for border properties.
    • border-color: sets the border color.
    • border-style: sets the border line style.
    • border-width: sets the border width.
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Selection dropdowns

The select elements of Docxpresso roughly correspond to the standard HTML select form elements.

The core method responsible of inserting an input element within a document is the select method which public API is given by:

Signature

public select ([$options])

Parameters

  • $options (type: array).
    This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated with the latest available created form.
    • name (type: string), a unique name that identifies the element. If not given will be automatically generated.
    • items (type: array). An associative array with keys as options and values the corresponding option form values.
    • selected (type: string). The name of the selected item.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The relevant CSS style type styles that one may apply to an input field include (where ‘*’ in this context stands for top, right, bottom or left).

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Text:
    • font: shorthand for font properties.
    • font-family: sets the font to be used.
    • font-size: sets the font size.
    • font-style: sets the font style.
    • font-variant: sets the font variant.
    • font-weight: specifies how thick the characters should be displayed.
    • font-kerning: specifies the kerning information.
    • letter-spacing: increases or decreases the separation among characters in the text.
    • color: sets the font color.
  • Borders (individual borders are not supported):
    • border: shorthand for border properties.
    • border-color: sets the border color.
    • border-style: sets the border line style.
    • border-width: sets the border width.
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Submit buttons

The button elements of Docxpresso roughly correspond to the standard HTML submit button form elements.

The core method responsible of inserting an input element within a document is the button method which public API is given by:

Signature

public button ([$options])

Parameters

  • $options (type: array). This array has the following available keys and values:

    • form-name (type: string). The name of the form in which we wish to include this form control element. If not given it will be automatically associated with the latest available created form.
    • name (type: string), a unique name that identifies the element. If not given will be automatically generated.
    • value (type: string). The button value that will be displayed.
    • pageNumber (type: string). It only applies to absolutely positioned controls (optional).
    • style (type: string). A string of styles in CSS format.

The relevant CSS style type styles that one may apply to an input field include (where ‘*’ in this context stands for top, right, bottom or left).

  • Size (if not set the package will automatically associate default measures):
    • width: the element width.
    • height: the element height.
  • Text:
    • font: shorthand for font properties.
    • font-family: sets the font to be used.
    • font-size: sets the font size.
    • font-style: sets the font style.
    • font-variant: sets the font variant.
    • font-weight: specifies how thick the characters should be displayed.
    • font-kerning: specifies the kerning information.
    • letter-spacing: increases or decreases the separation among characters in the text.
    • color: sets the font color.
    • text-align: sets the horizontal text alignment property.
    • vertical-align: sets the vertical text alignment property.
  • Borders (not supported)
  • Background:
    • background-color: sets the text background color.
  • Display:
    • float: it can be left, right and also center.
    • margin: specifies all margin widths in one shot.
    • margin-*: specifies one margin at a time.
    • position: absolute or relative.
    • top: distance from the top for absolutely positioned textboxes.
    • left: distance from the left for absolutely positioned textboxes.

Form samples

Let us start with a simple form that includes all standard form elements:

<?php
/**
 * This sample script inserts a simple form
 */
require_once 'pathToDOCXPRESSO/CreateDocument.inc';
$doc = new DocxpressoCreateDocument();
$format = '.pdf';//.pdf, .odt, other document formats do not support forms
//insert the form wrapper
$doc->form(array('name' => 'sampleForm', 'action' => 'http://www.Docxpresso/test_form.php', 'method' => 'get'));
//insert the form controls
//input text
$doc->paragraph()
        ->text(array('text' => 'Your name: '))
        ->inputField();
//select dropdown
$items = array('Male' => 'man', 'Female' => 'woman');
$doc->paragraph()
        ->text(array('text' => 'Gender: '))
        ->select(array('items' => $items, 'selected' => 'Female'));
//checkboxes
$checkboxStyle = 'margin-left: 20pt';
$doc->paragraph()
        ->text(array('text' => 'Programming languages: '))
        ->checkbox(array('name' => 'PHP', 'value' => '1', 'checked' => true))->style($checkboxStyle)
        ->text(array('text' => ' PHP '))
        ->checkbox(array('name' => 'Java', 'value' => '1'))->style($checkboxStyle)
        ->text(array('text' => ' Java '))
        ->checkbox(array('name' => 'NodeJS', 'value' => '1', 'checked' => true))->style($checkboxStyle)
        ->text(array('text' => ' NodeJS '));
//radio buttons
$radioButtonStyle = 'margin-left: 20pt';
$doc->paragraph()
        ->text(array('text' => 'Favourite OS: '))
        ->radioButton(array('name' => 'OS', 'value' => 'Linux', 'selected' => true))->style($radioButtonStyle)
        ->text(array('text' => ' Linux '))
        ->radioButton(array('name' => 'OS', 'value' => 'Windows'))->style($radioButtonStyle)
        ->text(array('text' => ' Windows '))
        ->radioButton(array('name' => 'OS', 'value' => 'Mac'))->style($radioButtonStyle)
        ->text(array('text' => ' Mac '));
//textarea
$doc->paragraph()
        ->text(array('text' => 'Message: '))
        ->textarea();
//submit
$doc->paragraph()
        ->button(array('value' => 'Send'));

//include in the render method the path where you want your document to be saved
$doc->render('simple_form' . $format); 
//echo a link to the generated document
echo 'You may download the generated document from the link below:<br/>';
echo '<a href="' . 'simple_form' . $format . '">Download document</a>';

DOWNLOAD:download pdfdownload odt

For fine adjustment of position of the form elements one may play with the vertical align property of the containing paragraph and the top margin property of the form element or use a table for layout.

Let us run another example that implements some of the styling properties defined above:

<?php
/**
* This sample script inserts a simple form
*/
require_once 'pathToDOCXPRESSO/CreateDocument.inc';
$doc = new DocxpressoCreateDocument();
$format = '.pdf';//.pdf, .odt, other document formats do not support forms
//insert the form wrapper
$doc->form(array('name' => 'sampleForm', 'action' => 'http://www.Docxpresso/test_form.php', 'method' => 'get'));
//insert the form controls
//input text
$inputStyles = 'border: 1pt solid #444; width: 5cm; font-family: Arial; margin-left: 5pt';
$textStyles = 'font-family: Arial; font-size: 10pt';
$doc->paragraph()->style($textStyles)
->text(array('text' => 'Your name: '))
->inputField()->style($inputStyles);
//select dropdown
$selectStyles = 'border: 1pt solid #444; width: 3cm; font-family: Arial; margin-left: 5pt';
$items = array('Male' => 'man', 'Female' => 'woman');
$doc->paragraph()->style($textStyles)
->text(array('text' => 'Gender: '))
->select(array('items' => $items, 'selected' => 'Female'))->style($selectStyles);
//checkboxes
$checkboxStyle = 'margin-left: 15pt';
$doc->paragraph()->style($textStyles)
->text(array('text' => 'Programming languages: '))
->checkbox(array('name' => 'PHP', 'value' => '1', 'checked' => true))->style($checkboxStyle)->style('margin-left: 5px')
->text(array('text' => ' PHP '))
->checkbox(array('name' => 'Java', 'value' => '1'))->style($checkboxStyle)
->text(array('text' => ' Java '))
->checkbox(array('name' => 'NodeJS', 'value' => '1', 'checked' => true))->style($checkboxStyle)
->text(array('text' => ' NodeJS '));
//radio buttons
$radioButtonStyle = 'margin-left: 15pt';
$doc->paragraph()->style($textStyles)
->text(array('text' => 'Favourite OS: '))
->radioButton(array('name' => 'OS', 'value' => 'Linux', 'selected' => true))->style($radioButtonStyle)->style('margin-left: 5px')
->text(array('text' => ' Linux '))
->radioButton(array('name' => 'OS', 'value' => 'Windows'))->style($radioButtonStyle)
->text(array('text' => ' Windows '))
->radioButton(array('name' => 'OS', 'value' => 'Mac'))->style($radioButtonStyle)
->text(array('text' => ' Mac '));
//textarea
$textareaStyles = 'border: 1pt solid #444; width: 9cm; height: 5cm; font-family: Arial; margin-left: 5pt';
$doc->paragraph()->style($textStyles)
->text(array('text' => 'Message: '))
->textarea(array('scroll' => false))->style($textareaStyles);
//submit
$buttonStyle = 'margin-left: 4.5cm; background-color: #ff6600; font-weight: bold; color: white; height: 1cm; width: 3cm';
$doc->paragraph()
->button(array('value' => 'Send Data'))->style($buttonStyle)->style($textStyles);
//include in the render method the path where you want your document to be saved
$doc->render('form' . $format); 
//echo a link to the generated document
echo 'You may download the generated document from the link below:<br/>';
echo '<a href="' . 'form' . $format . '">Download document</a>';

DOWNLOAD:download pdfdownload odt