Introducing Form Builder
In our continuous efforts to enhance user experience, we are thrilled to introduce our new form template feature. This feature has been designed to make creating and editing form templates more user-friendly and less cumbersome. No longer will you need to edit code to make changes to your templates.
What's New?
Our new form template feature offers a revamped user interface, complete with a new drag-and-drop design, robust form customisations, and an easier template setup flow. You can create a form entirely from scratch or use existing templates, add a large variety of fields and elements, customise appearance and even pre-fill fields with data from your server.
How to use
Enabling the form builder
Get in touch with our support team to enable Joyfill form builder on your server.
Create from an existing form in the library
Go to Control Panel > Forms V2 > Choose from template library
From drop-down list, select the country the form is applicable to
A list of forms will be displayed. Select one to view a preview of the form you'll be editing, then click Start using this form to go to the form builder
Create from a blank template
Go to Control Panel > Forms V2 > Create blank template to go immediately to the form builder and start creating your form from scratch. You can then upload your own PDF if you have your own template you want to work from.
Modify an existing form
Go to Control Panel > Forms V2
Click Modify next the form you wish to make changes to
Using the form builder
The form builder is comprised of 3 sections; a list form elements on the left, the form editing area in the middle and the settings panel on the right.
Form elements
To add specific elements to your form, simply click and drag the desired element into the form. You also can use the search bar to quickly find a specific option.
Form editing area
For each element in the form you can use the icon in the upper right hand corner of the element to move it around, or the icon in the lower right corner to resize the image. The position of the other elements already on the form will be repositioned accordingly.
At the bottom of the form building area is a page tool where you preview what the form will look like on mobile and web. You can also add, duplicate and delete pages. The cog icon will display the options for the form to in the settings panel, which also lets you upload more pdf files if needed.
Settings panel
The settings panel is where you can make changes to the element currently selected in the form editing area.
Configuration options
The settings under the cog icon of the settings panel. Controls the content and behaviour of the selected element.
Title | The text written here will appear at the above the element. You can also toggle the visibility. |
Field | Field options provide settings for the field itself, including default pre-filled text or choice options, read-only, required fields and visibility. |
Conditions | Allows you to set the conditions by which the field shown or hidden, based on information provided in another field. |
Tooltip | Set up tooltips for the element. You can set the tooltip name and description and toggle visibility. When visible, an information icon appears in the live form which displays the tooltip when tapped or the mouse cursor is over it. 
|
Prefill form | Clicking on this field allows you to search and select data sources from your Uptick server to pre-fill the field automatically. 
|
Design options
The settings under the pallet icon of the settings panel. Controls the formatting and appearance of the selected element.
Title | Format, font and colour options for the title text. |
Text | Format, font and colour options for the text in the field. |
Field | Colour and formatting options for the field itself, including colour, sizing, padding, and margins |
Saving the form
Once all form authoring or editing is done, you can click Save form for new forms, or Save changes if editing an existing template.
Selecting the New Form on Mobile
Once your form is ready, it be can set against pre/post task form type Actions. You can then open the task on the mobile app, where you will see the form, with any pre-filled fields. Technicians and engineers can then proceed to fill out the form as they normally would.
As always, if you have any questions or need further assistance, don't hesitate to reach out to our support team.