Joget DX Available for Download
Check out Joget DX, the next generation successor to Joget Workflow for faster, simpler digital transformation.
Figure 1 : Adding a Text Field to the Form
First, add a Text Field element to the form and put "city" as field ID.
Next, add a Custom HTML element to the form and copy the following script into the Custom HTML property.
Figure 2 : Adding a Custom HTML Script to the Form
1. By default, the js library file of jQuery and jQueryUI is included in the Joget form.
2. The "city" in "[name$=city]" in the code must be the same with that in your Field ID.
After adding the script, click on Preview in Form Builder. Type "kua"; the text field will appear like this:
Figure 3 : Preview and Check Autocomplete Field
A preview and check on the Autocomplete text field showed that it is working, although it looked a little unpleasant. Adding the following CSS to the Custom HTML improved the way the Autocomplete text field looked.
Figure 3 : Completed Auto Complete Field