...
Textboxes
...
are
...
the
...
most
...
commonly
...
used
...
input
...
fields.
...
All
...
green-screen
...
input
...
fields
...
will
...
be
...
automatically
...
converted
...
to
...
textboxes.
...
A
...
textbox
...
is
...
a
...
basic
...
form
...
element
...
that
...
allows
...
the
...
user
...
to
...
input
...
text. 
Auto-Complete
...
A
...
very
...
useful
...
option
...
that
...
can
...
be
...
applied
...
to
...
a
...
textbox
...
is
...
Auto-Complete.
...
This
...
is
...
where
...
a
...
list
...
of
...
valid
...
options
...
is
...
displayed
...
below
...
the
...
textbox.
...
This
...
list
...
is
...
updated
...
with
...
each
...
key
...
the
...
user
...
types.
...
The
...
user
...
can
...
then
...
select
...
one
...
of
...
the
...
listed
...
options
...
which
...
will
...
be
...
placed
...
within
...
the
...
textbox.
With the use of auto-complete,
...
comes
...
another
...
useful
...
feature:
...
the
...
ability
...
to
...
utilize
...
different
...
choices
...
and
...
choice
...
values.
...
For
...
example,
...
if
...
the
...
original
...
input
...
field
...
(textbox)
...
requires
...
a
...
user
...
to
...
enter
...
a
...
category
...
number,
...
an
...
auto-complete
...
textbox
...
may
...
allow
...
a
...
user
...
to
...
enter
...
a
...
category
...
description
...
instead
...
of
...
the
...
number.
...
The
...
description
...
(choice)
...
is
...
displayed
...
on
...
the
...
Genie
...
screen
...
but
...
the
...
number
...
(value)
...
is
...
passed
...
to
...
the
...
underlying
...
application.
...
There
...
are
...
three
...
ways
...
of
...
providing
...
a
...
list
...
of
...
choices
...
for
...
auto-complete.
...
Auto-Complete
...
Choices
...
These
...
choices
...
are
...
a
...
fixed
...
list
...
entered
...
directly
...
into
...
the
...
properties
...
dialog.
...
They
...
are
...
entered
...
as
...
a
...
comma
...
separated
...
list.
...
An
...
edit
...
dialog
...
box
...
provides
...
an
...
easy
...
interface
...
to
...
add
...
or
...
update
...
the
...
list.
...
This
...
edit
...
dialog
...
box
...
appears
...
if
...
the
...
button illustrated below is clicked. 
If you do not require different choices and values, simply leave the choice values list empty.
Database Driven Auto-Complete
This option allows the correct choices to be retrieved from a Database file. Simply enter the name of the database file, the name of the choice option field, and the name of the choice value field. The selection criteria can be used to filter the choices similar to an SQL WHERE clause. Max choices will limit the number of choices returned. 
Genie will use the library list of the underlying application’s job to search for the database file. There is no need to qualify the file name with the library name, although you can if required.
Once the file name has been entered, the "..." button in the choice options and choice value fields will open the dialog box shown below. This dialog lists all the fields in the specified file allowing easy selection of the correct field names.
Dynamic Auto-Complete
Dynamic Auto-Complete is typically used if the selection criteria are too complex for the database driven auto-complete.
In this case, a URL is supplied in the properties box. Genie will post a field called query to the URL (typically a CGI program written in RPG, PHP, or Java) and the program must return the options in the correct format as shown in the example below. In this example, five results are being returned. 
| Code Block |
|---|
{success:true, response:{ "colWidths":[30,7], "results":[ {"CNAME":"CLIMBING ACCESSORIES", "CATID":"81"}, {"CNAME":"CLIMBING HARDWARE", "CATID":"77"}, {"CNAME":"CLIMBING PITONS", "CATID":"76"}, {"CNAME":"CLOTHING", "CATID":"20"}, {"CNAME":"CLIMBING", "CATID":"2"} \] } } \\ \\ The colWidths numbers define the maximum length of CNAME and CATID respectively. \\ Genie is using AJAX to retrieve the data from the CGI program which can be written in any CGI language. (RPG programmers should consider Profound Logic’s RPGsp development environment.). Under normal circumstances, AJAX cannot be used to call CGI programs on another domain however this is possible by altering the Apache configuration file for Genie. \\ \\ \\ \\ h3. _Onblur events_\\ A very useful property for a text-box is the *onblur* event handling property. This will run when the user clicks out of on the textbox, or when the textbox loses focus. It can be used to run any Genie or JavaScript commands. \\ The example below will press the Enter Key when focus is lost on the textbox. \\ \\ \\ \\ \\ Perhaps a more useful example would be to call a custom function to ensure that the data in the textbox is valid. If the data is invalid, an alert box can be displayed and the cursor can be placed back in the textbox. This would force the user the supply valid data before proceeding. The example below calls a JavaScript function to check if the information entered is a valid date. \\ \\ \\ \\ \\ \\ h3. _Overtype Mode_\\ By default, a textbox in Genie operates in *overtype* mode. For example, if you place the cursor at the beginning of a textbox that contains a value, any new text will overwrite the existing text. \\ \\ \\ \\ \\ \\ Genie can be configured so that all textboxes operate in insert mode \\ \\ \\ \\ Overtype mode can be turned off in the Genie Administrator. This selection can be chosen to apply globally (all skins) or just to one skin. See page 4* \* for more information on how to use the Genie Administrator. ] } } |
The colWidths numbers define the maximum length of CNAME and CATID respectively.
Genie will using AJAX to retrieve the data from the CGI program which can be written in any CGI language. Under normal circumstances, AJAX cannot be used to call CGI programs on another domain; however, if calling a program on another domain is required, this can be implemented by creating a ProxyPass configuration in Profound UI.
Onblur events
A very useful property for a text-box is the onblur event. This will run when the user clicks out of on the textbox, or when the textbox loses focus. It can be used to run any Genie or JavaScript commands.
The example below will press the Enter Key when focus is lost on the textbox. 
Perhaps a more useful example would be to call a custom function to ensure that the data in the textbox is valid. If the data is invalid, an alert box can be displayed and the cursor can be placed back in the textbox. This would force the user the supply valid data before proceeding. The example below calls a JavaScript function to check if the information entered is a valid date.
Overtype Mode
To be consistent with green-screen behavior, by default, a textbox in Genie operates in overtype mode (however, this feature is only supported in IE). For example, if you place the cursor at the beginning of a textbox that contains a value, any new text will overwrite the existing text. 
Genie can be configured so that all textboxes operate in insert mode at all times. 
Overtype mode can be turned off in the Genie Administrator. This selection can be chosen to apply globally (all skins) or just to one skin.
