BreezingForms 8/3/2009 1

The expansion BreezingForms is an easy to use

BreezingForms form generator, which allows simple, one-on-line
form to the mini-database application everything
Guide quickly to develop and test. It allows you to pre-
made features, such as the input of the user to
check, but also in your own PHP scripts write to the
GOOGLE TRANSLATE FROM: forms are attached. The received data can even
http://openbook.galileocomputing.de/joomla15/jooml use a mouse to click further into the flexible XML
a_18_formulare_neu_001.htm#t2t32 format. The BreezingForms are incidentally the
successor program of the FacileForms, one of the
most popular extensions for Joomla! 1.0 have
18.1 BreezingForms
been the note alone that the name "FacileForms"
18.1.1 Installation and configuration with many functions not yet fully been replaced
and is in this description occasionally aufblitzt.
18.1.2 The BreezingForms in the overview
We describe below the current version
18.1.3 Draft Example form BreezingForms 1.5.1 RC1. The program is so
extensive that we are an introduction to restrict
18.1.4 The form surface them. Further information is available on the site
of frequent BreezingForms-fan, www.crosstec.de.
18.1.5 Functions for the form and the elements

18.1.6 The management of data

18.1.7 form in front end anchor 18.1.1 Installation and configuration

18.1.8 form in the backend menu anchor Get in Table 18.1 listed files. These files can be
found on the respective installers mount (see
18.1.9 Form Export / Import
Section 9.4, New install extensions "). This can
also be found on the DVD in the directory
extensions / breezing_forms.
"Dance is the art of a couple, on a very small space as
freely as possible to move themselves and others
without using their feet to kick!" Unknown Table 18.1 The files of BreezingForms

File Name
18 Forms: BreezingForms Definition
Function
If you are in the default installation of Joomla!
want to involve functional forms, about which your com_breezingforms_151rc1.zip
readers, for example, to an event log, you must
have good HTML, PHP and MySQL skills and based
Component
on a complicated stage of development lie in wait.
Easy does it with extensions and BreezingForms
Chrono Forms. Both components can achieve the Core component
same result, but they are based on completely
different approaches: While the forms in the mod_breezingforms_151b2.zip
BreezingForms directly into Joomla! can generate,
they are in Chrono Forms with an HTML editor such Module
as Dreamweaver and then on the side involved.
Both tools are very powerful and have their fans. BreezingForms as module
But do you see yourself in the following
plg_breezingforms_151b2.zip

Plug-in
18.1 BreezingForms
BreezingForms as a plug-in (Mambot)
BreezingForms 8/3/2009 2

The next step is to install sample forms. To do so

via the Components menu or the Quick Check on
the point configuration (Figure 18.1).
18.1.2 The BreezingForms in the overview

In the quick overview that you via the components

menu, you should now the options are shown in
Figure 18.3.

Click here to enlarge the picture

Click here to enlarge the picture
Figure 18.1 The second step in installing the
BreezingForms
As you see, you can also transfer data from an
older version of Facile Forms upgrade.
Let the standard patterns (samples) were selected
and go to Continue with Step 3 Here, you will be
told that the installation was successful, and you'll
turn on Continue to Step 4, the actual
configuration of the dialogue BreezingForms that
you even after the installation again can access
(Figure 18.2).
Figure 18.3 After installing the Forms appear in the quick
overview.
Like Joomla! The program itself is BreezingForms
divided into several managers, each with different
management tasks have.
Table 18.2, the menu of BreezingForms
Manager
Task
Entries
Display and processing of the received form data

Admin Menu Management

Integration of forms in the backend menus

Manage Forms

Creation and design of forms

Scripts

Creation of scripts for elements

Click here to enlarge the picture Manage Parts

Figure 18.2 The Configuration window of BreezingForms Creation of scripts for the form expiration

Here you can for example, the text elements in a Configuration

form with the WYSIWYG editor on, your e-mail
address as the default contact, and forms in the Main settings BreezingForms
import and export.
BreezingForms 8/3/2009 3

If you live in one of the managers BreezingForms

jump, see above the respective surface a tool bar
(Figure 18.4), which easily between different views
to and fro can jump.

Click here to enlarge the picture

Figure 18.4 The tool bar on all BreezingForms managers

In the menu you see among the managers,

another group, Facile Forms Sample menu, which
you install option could take over. These are some
sample forms that you use as material for use or
modify to suit your needs and can be further Click here to enlarge the picture
processed.
Figure 18.5 Sketch of Kursanmeldung
Table 18.3 BreezingForms Sample Menu

Sample
Description 18.1.4 The form surface

Contact form
Before looking at the implementation of our sketch
form that we want to give you some basic
Contact information about the form of creation in the
BreezingForms give.
Pizza Shop
If you created a new form, you will receive a blank
Pizza Service design surface presents, on which you can arrange
your elements (Figure 18.6). About the New Page
button before and after New page you can also
create multiple pages, and then pasted on
navigation buttons together.
18.1.3 Draft Example form

The creation of a form should you like best based

on a concrete example to know. We want our
dance school for a simple application form for
Joomla! Create dance. This should be the sketch
shown in Figure 18.5 correspond.

Click here to enlarge the picture

Figure 18.6 The empty design view of a form

BreezingForms 8/3/2009 4

The BreezingForms provide for the realization of Note

the form a number of elements are available which
can be partly linked to the HTML conventions Small text icon with information when you hover
(Figure 18.7), but also offer additional options, the mouse over the item goes
such as the tooltip.

Checkbox

Multiple selection box

Radio button

Simply select box

Click here to enlarge the picture

Figure 18.7 The form elements that you BreezingForms

available
Text
In Table 18.4 you will find all elements with an
explanation and, where appropriate, with their Single line text entry box
concrete implementation in a statement.
--
Table 18.4 Elements of BreezingForms
Text Area
Name
Meaning Multiline text field
Execution
--
Static Text / HTML
Picklist
Simple (formatted) text, for example, to label a
field Drop-down list

--

Rectangle

Viereck, decorative, frame, etc.

-- Query list

Graphics Query the database

Static image for decoration --

-- File Upload
BreezingForms 8/3/2009 5

Form field for uploading files

Hidden input

Hidden Field

--

Normal Button

Button

Click here to enlarge the picture

Figure 18.8 A new form is created.

Graphic Buttom
The item package offers the possibility of your
Button with a picture as background form an existing or add new package. About the
concept of packages you can later filter the list
view or a package can be easily exported. We take
for our example, a new package Anmeld_tanzkurs
"a.
Pictogram
Once you have saved the form, it appears in the
list in the form manager (Figure 18.9).
Image, which acts as a button

As you know, has already created a page, but still

completely empty. About the Package drop-down
list, you can also download the forms in the other
packages view. In the event that you there is only
one empty table available, try on this same drop-
down list to select our package.
The design surface is equivalent to the WYSIWYG
principle and knows now the drag & drop
functionality. Size and position of the elements
can move the mouse can be influenced. The
elements can also be configured via the settings
window with the arrow tool, or be moved.
Click here to enlarge the picture
Creating a new form
Figure 18.9 The new form in the Form Manager
Let us begin our example form. Go to Forms
Management, and set about a new form. Name and Text box
title of the form are mandatory inputs (Figure
18.8). The title is the term under which the We will now form with some elements equip. Click
created element, for example, appear in lists, so on the title. You are now in edit mode and can add
it's better for people to read. About his name is input elements. Click New. In the subsequent
technically programmable element, eg in scripts, dialog, you are asked to select from preset options
but also within the Joomla! Configuration to take input (Figure 18.7).
addressed. Make sure therefore that the name
does not contain special characters or diacritics.
We need first the input field for last name, and
The other settings, such as the size of the form can
therefore click on the radio button input text. With
also be reasonably made.
further proceed. Now a form in which this
BreezingForms 8/3/2009 6

information to the text box can be set in detail

(Figure 18.10). So you can for example determine
if the text box for passwords and is designed
accordingly when entering only asterisks are
displayed.

Click here to enlarge the picture

Click here to enlarge the picture Figure 18:12 configuration of lettering

Figure 18:10 Selection of form elements
If you saved the text field, you'll see it left in the
list of form elements and right in Design view of
the form (Figure 18.11).
In Design view of the form you will see the label
and the field, although still a little differently to be.
In the previous versions could not be the elements
with the mouse back and forth. This is now
possible. Alternatively, you can put an item in the
list, highlight it and use the arrows next to the
form design to move (Figure 18.13).

Click here to enlarge the picture

Click here to enlarge the picture

18:11 The image processing view of the form with a text

Figure 18:13 The tool used to move parts of the form
entry box

By specifying the pixels, you can refine positioning

Settings, which until then had not been saved will
of the elements. Do not forget the new
not be considered.
arrangement with secure storage, otherwise the
form will be reset.
Static text box
Multiple choice
We now want to label the input and therefore add
You can also move multiple elements
a further element added. To do this we go back to
simultaneously by selecting them in the list.
New and then select in the option Static Static Text
/ HTML (Figure 18.7). In the settings for that item,
The same procedure, we repeat for the first name
you should next title and name of course, the
and e-mail address. Two boxes and two labels will
bottom the text of the inscription, in our case
be added and positioned. Our form now looks like
"Name" enter (Figure 18.12).
Figure 18.14.
BreezingForms 8/3/2009
Click here to enlarge the picture
Figure 18:14 Our first form
Radiobuttons
Next, we add two radio buttons for specifying the
gender. In the configuration dialog you can set the
caption in the same field labeled Enter (Figure
18.15).
Click here to enlarge the picture
Figure 18:15 The attitude of radiobuttons
Radiobuttons used correctly
The sense of a group of radio buttons is that
always only one element can be clicked. To notify
the program, radio buttons that belong together,
you have every item in the Name field the same
value.
The radio buttons should now be present as shown
in Figure 18.16.
Click here to enlarge the picture
Figure 18:16 The radiobuttons
7
Drop-down list
For the indication of a particular dance, we need a
so-called drop-down list. It is in the selection
window of the elements (Figure 18.7) as a
selection list means. The configuration can be
seen in Figure 18:17.
Click here to enlarge the picture
Figure 18:17 The configuration of the drop-down list
Through the multiple-choice allows you to specify
whether the list contains several entries may be
selected. This is in our case, however, does not
make sense. The choices you write to each other
in the Options box, in three sections, each with a
semicolon separated:
1; Please select rate; 0
0; Joomla! / Beginners; 1
0; Joomla! / P, 2
0; Joomla! / Professional, 3
The first part can be either a 1 or a 0 may be
indicated. The 1 means that this is the default
setting should be. The second section gives the
user a list item to be seen. If in the third part
values are used, they are transmitted. This allows,
for example, dance classes are internally
numbered.
Tip
If you are the first line of information for the user
to formulate, you save an additional labeling of the
drop-down list. Also, you can then determine
whether the user ever has made a selection.
The result you see in Design view and in Figure
18:18.
BreezingForms 8/3/2009 8

configure it in the Preferences dialog (Figure

18.20).

Click here to enlarge the picture

Figure 18:18 Our drop-down list

Tooltip

An item that you already from the Joomla! Surface

should know, is the tooltip. We want our course
selection list a tooltip to one side, the user is Click here to enlarge the picture
informed to whom he was with any questions
about course content can turn. Figure 18:20 Setting the Submit button

These we choose in the notice of Static (Figure The button, type Default button appears as shown
18.7) and set it according to our wishes (Figure in Figure 18.21.
18.19). It could be for example about the type of
its own special mount small icon. We remain in
our example, however, when the blue information
icon.
Click here to enlarge the picture

Figure 18:21 The Submit-(send) button

Recently our form even get a headline. To do this

we move all elements down by putting in the list all
the items on the top checkbox in the title bar and
then using the arrows to the bottom set.

Then we add an additional static text field for the

Click here to enlarge the picture
title. To view the text as a heading format, you
should use Facile Forms • Components •
Configuration the WYSIWYG editor for text fields
on. Now you can "Course Registration" as the
heading of level 2 and italic formatting.

Figure 18:19 The settings of the tooltips

The surface of our form is finished (figure 18.22).

If you have saved, you will see the icon and can
be inserted in addition to the course list position.

What's missing now is the submit button, the data

to the server.

Submit button

The creation of the buttons follows a similar

procedure as the creation of the previous
elements. You select buttons in the area (Figure
18.7) a button with the desired layout and
BreezingForms 8/3/2009 9

No is the default setting and means that no

script has been selected.

Under library you can choose several

predefined scripts.

At the most flexible, but also the most

demanding is the last option, special. Here
you can find out about the framework code to
create the model of a function set and the
placeholders and the actual program is part
of PHP commands replace.

To give you an overview, we have shown in Figure

18:23 for any drop-down list, all three function
Click here to enlarge the picture options distributed to the various script categories.
Below we would like to script the different areas
The complete mapping 18:22 Registration through some practical examples to explain.

18.1.5 Functions for the form and the

elements

Now that the formalities are done, we can form

the functions of the turn. Each form and each
element can be dynamic scripts, so small parts of
the program, assign, which - depending on a
number of events - executed. You can find these
scripts in the configuration dialog of the individual
elements on the tab scripts. They fall into three
categories:

Table 18.5 The various script categories

Click here to enlarge the picture

Script type
Figure 18:23 Various Script Options
Function
The focus on one element set
Initialization script
Let us return to our example. When you call a
What happens when you load the item?
form, the focus by default on the first element of a
form guide. We want now, however, that the
Action Script attention of the user to the first e-mail field is
withdrawn, so he entered this important first done
What happens when a certain action, such as a the same.
mouse click?
To do this we go into the scripts dialog of the e-
Validation script mail text box and click in the initialization scripts
range option library. Then select the checkbox
What should the content of an element to be entry form and look at the script function FF:
tested? ff_getfocus from. Save your entries from.

For each of these categories, you have the choice

between no, and special library.
BreezingForms 8/3/2009
Click here to enlarge the picture
Figure Focus 18:24 The script append
You can already in Design view, verify that the
cursor is when initializing the form in the mail box
is located.
Validation of entries
If a user has filled out a form, errors often creep
or mandatory fields are ignored, what impact on
the entire communication process could have. To
cushion the erroneous entries, you can see from
the respective form fields small program attach
script, after clicking the Submit button, but before
inserting the data into the database the user
indicates that the form in some places, or even
wrong has not filled out.
In our example, a script to verify that in fact an e-
mail address in the blank e-mail has been entered.
To do this we click twice on the input e-mail and
then we go into the Scripts tab (Figure 18.24).
Here you select the validation script for the radio
button and select Library in the drop-down list to
the function ff_validemail. In the box above, you
can specify the exact error message should be
output if the user is not a real email address
entered.
As you are in the drop-down list to see the variety
of validity tests to be carried out. To test for
example ff_integer_or_empty whether the field
contains an integer or is empty.
10
Click here to enlarge the picture
Figure 18:25 The e-mail address should be reviewed.
About the Submit button
So far, our Submit button for a certain task, but
not yet operational. We must once again in the
configuration of the buttons and tabs on the scripts
to connect a function (Figure 18.25). Select action
script in the Library radio button, and activate the
function ff_validate_submit which initially set the
validation script and then passes the data
abschickt.
They could be here but also other actions
connected with the button - for example, the jump
to another page of the form.
Click here to enlarge the picture
Figure 18:26 The button with the Submit function
connect
Feedback to the user,
If the form has been submitted, the user should
not be confused, but send him a message that the
transfer went smoothly. The script that is needed
is not this time with a single element, but with the
entire form connected.
BreezingForms 8/3/2009
We therefore go one level up in the Form Manager
and go into the configuration by looking at the
name (!) Our form click. Again we find the scripts
tab Figure 18:27. Select the area \ 'Where \' radio
button script library and from the drop-down list
function ff_showsubmitted and save your input.
Click here to enlarge the picture
Figure 18:27 The setting of the feedback
Now you can use the form in Design view for free.
When entering an incorrect e-mail address, for
example, without the "@" character, the JavaScript
message will appear in Figure 18:28.
Click here to enlarge the picture
Figure 18:28 The message in the event of a false e-mail
address
When the correct input you get a positive message
(Figure 18.29).
Click here to enlarge the picture
Figure 18:29 The data were successfully transmitted.
11
Error message?
If you are sending the message "send mail failed:
could not instantiate mail function" you should in
the Global Configuration • Mail mode (php,
sendmail, or smtp) smtp or sendmail to convert
(see Section 10.3, "Mail transit ").
18.1.6 The management of data
If the transmission of data works, you can use the
entries on the menu item View Record
management and processing (Figure 18.30). The
last record is received at the bottom.
Click here to enlarge the picture
Figure 18:30 Overview of records
In addition to information such as the date of
transmission, the IP address and the provider of
the recipient you will see interesting information on
the status of the record.
Table 18.6 Information on the Record
Status
Meaning
Sighted
The record has already been sighted.
Exports
The data were already converted to XML.
Archived
The data were put into the archive.
About the list forms are filters that allow you to
view the data on the basis of the status
information can put together. On the right side
BreezingForms 8/3/2009
there are also buttons that give rise to the order of
the list items accordingly leaves.
The Export button transforms the XML data into
XML and makes it so different for other applications
to read.
To view individual records in detail, click the
column sent to an entry. You will receive a
detailed overview of the static information received
(Figure 18.31). If you click Save, the record is
automatically converted sighted.
Click here to enlarge the picture
Figure 18:31 The detail view of the data
For archiving data, click the red cross in the
column Archived (Figure 18.30). This is the record
to the archive. This archive allows you to consider
if the archive filter to only archived set. To
permanently delete data, select it and click the
Delete icon.
18.1.7 form in front end anchor
There are three options, the form in front end
process:
You can have it as a component in a front-
end menu anchor, what difficulty you are
not more likely to show (see Section 6.3.3,
"Create a menu item").
Since we also BreezingForms module
installed, there is the option of the form as
a module to display. Also on this approach,
12
we are already in Section 9.1, "Modules",
received.
If you use the plug-in file from
BreezingForms installed, you can use your
form as a plug-in to an existing content
element mount.
How this works, we tell you in the hereafter.
First, the plug-in public. Now you can edit mode
of any item the plug-in Day
(FacileForms: Name_des_Formulars, 1, 0)
eintragen. This will be replaced by your form.
The second parameter to determine which side of
the form is displayed, and the third parameter you
can set the context or issue.
For our example, we have the following line at the
end of the article "Latin American Dances" in the
category of "dance style" a:
(FacileForms: form_anmeld_tanzkurs, 1, 0)
This will create the form directly in the article (see
Figure 18.32).
Click here to enlarge the picture
Figure 18:32 The form in the article
18.1.8 form in the backend menu anchor
BreezingForms 8/3/2009 13

Besides the possibility of the finished form in the

website process, one can, however, it also has a
self-created menu entry in the backend display.
Click on the option menu administration. The list
you see now is empty. We'll add to it new a new
menu item added. It opens a window with a listing
of all forms, on the Joomla! currently has access.

In addition to the numerous sample forms should

also be listed our form. Highlight it. About Next
takes you to the Configuration menu (Figure
18.33).

Click here to enlarge the picture

Figure 18:34 The settings for the menu item

The result can be considered equal in the backend

(Figure 18.35).

Click here to enlarge the picture

Figure 18:33 The selection of a form

In Superordinate position, you can specify where

the new menu item to appear. It will give you only
two options offered: the top means that the entry
equal footing with all other components directly to
the menu component is inserted. If you
Click here to enlarge the picture
BreezingForms Sample Menu select the menu item
appears as a sub-item of this menu item.
Figure 18:35 The new menu item in the menu
"Components"
In Title, enter the text of the menu one. To
decorate the menu item you can go to one of the
small icons to choose.

Do not forget, in the form name form enter your 18.1.9 Form Export / Import
choice.
To take a simple form of a Joomla! System to
another to transfer, the BreezingForms the concept
of packages available, which we already a little
above explained.

Imagine that our application form now in another

Joomla! Homepage want to take over. To do this
we go into the configuration page of BreezingForms
and click on the button package.
BreezingForms 8/3/2009 14

Click here to enlarge the picture

Figure 18:36 The button "package"

About ID, we can choose our package. Everything

in this package was put, whether it forms, scripts
or menu entries, is now once again creating a new
XML packet zusammengeschnürt and ready made. Click here to enlarge the picture

If you have not a care package assignment, you
can also manually do: You simply choose the blank
entry in the field and collect ID from the list now
appears all the necessities together.
Figure 18:39 Uploading a package
As you can see, you will find when you install the
BreezingForms included sample files and the
collection of pre-made scripts and parts that will
assist you in your equipment functional forms
supported. About Searching access to the
directory structure of your computer and can now
form the new package to import.

Click here to enlarge the picture

Figure 18:37 A Package

If you are at the bottom of the form, click Next,

you can enjoy your new XML packet receive, store
and share.

The opposite action, namely importing a package

form, works similarly simple. Click in the box
configuration to install packages.

Click here to enlarge the picture

Picture Package installation 18:38

You are all already installed packages that you in

this view you can also delete (Figure 18.39).