Customizing frevvo can be done in several different ways. It is important to consider all the alternatives available when deciding on a method to accomplish form customization.
On This Page:
Automatically format SSN
Correct the case of any text
Scroll to Top
A Tab control with many fields in each tab, may require a long scroll to switch from one tab to another. You can use a trigger control at the bottom of the first tab with a business rule to navigate the user to the second tab when the trigger is clicked. For example, when you click on the Next Tab trigger control on the Personal Information tab in the Application for Employment form shown a business rule will navigate the user to the Employment History tab.
Add my-scroll to the CSS Class property of the Trigger control which navigates the user to the second tab.
Set focus on a control when the form loads
Add setFocus to the CSS Class property of the control you want to focus on when the form loads.
This behavior will only be present when the form is opened using a share URL - you will not see it in Test mode. To test it, copy the form's share URL and paste it into a new browser tab.
Fetch Selected Table Cell Info
For this example, add two hidden text controls in your form.
- Hidden Control Index - set css class to 'c-row-index'
- Hidden Control Value - set css class to 'c-cell-value'
Add a business rule to display the values of these hidden controls in a Message control at run time.
Constrain Visible Table Rows and Add Scrollbar
Then on your table, set the CSS Class 'table-scroll'.
Add Horizontal Scroll Bars to a Table
- This works best when applied using Scripts at application level and has not been tested in a message control.
- For this Custom JS to work properly, table column widths must be set in pixels, not percentages. For example, column widths for a seven-column table could be 100px 200px 150px 250px 100px 100px 200px.
- Only those columns that are visible directly on the form without scrolling are printable.
Auto-expand a textArea
Set Max Character Limit on TextArea
Automatically submit a form
Add conditional-submit to the CSS Class property of the control whose value is to be compared.
Automatically Submit a Workflow Step
Workflow steps only allow for one Activity Document Action (ADA), but there are cases where you may want to configure a second ADA (such as a second email) from the same workflow step. If the step is at the end of the workflow, you can use Workflow Doc Actions to accomplish this task. For steps in the middle of a workflow, create an additional linked step, set up the second ADA on the added step, and then use a script to automatically submit that step so the users will not see it. The script is similar to that for Auto-Submit a Form, but one key difference is that you will need a rule on the form that sets your conditional-submit control to the value specified in the script ("next" in the example below) on the step that should auto-submit, and then use the else action to set that control to empty on all other steps. Add conditional-submit to the CSS Class property of the control whose value is to be compared.
Extra Submit button
Users expect the submit and cancel buttons to be located at the bottom of a form. Moving the location of the Submit control is not recommended.
Submit on Enter Key Press
Hide the Submit and Cancel buttons
Continue/Finish button on top of the flow
Prevent Session Timeout
Sometimes you may need the session timeout for a particular form to be a lot longer than the default session timeout that makes sense for your entire tenant. Imagine your tenant session timeout in frevvo is set to 30 minutes. One of your forms takes a long time to fill out. You want to allow idle periods greater than 30 minutes for that form only.
In the above Custom js you can also use /frevvo/heartbeat in place of /frevvo/web/login.
Auto Control Validation
Add onlyDigits in the CSS Class property of the Quantity control.
Detect Browser Information
Write a business rule that checks the browser information populated in your text control to decide if the section of your form that contains the wet signature should be displayed or not.
Save Screen Flow to Task List
If two sequential workflow steps are assigned to the same person, this creates a screen flow. Screen flows immediately navigate a user to the next screen in the flow when they click the Continue button. Sometimes you don't want a user to automatically navigate to the next screen, for example the next step might be something you want the user to perform days after the first step rather then immediately.
In order to use this solution you will also need to:
- Add a text control named 'temp' to your form and uncheck the visible property to make it hidden.
- Add a text control named 'username' to your form and uncheck the visible property to make it hidden.
- Add the following business rule to your form.