...
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.
...
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
...
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"}
]
}
}
|
...
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.
...
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.
...