Form Building Best Practices

Our recommended practices for building forms

This article walks through a few of the options for placing code in forms. It includes some guidlines on where and perhaps more importantly, where not to, put code.

For including code into forms, you almost always use javascript.

Where to Put Code

For form specific code, there are three places that we recommend to put your code, Custom Events, the Custom Head Content field, and theme files.

Code in custom events is only executed when the event is fired, but it is a standard location, and "makes sense" to look there for maintenance or upgrades to the form. This is the ideal place to put code that is not re-used across forms.

custom event example

Custom Head Content is available under the Advanced section of the Form Settings. Any text placed here is added to the Head of the web page when it is displayed.

custom header content

Embedded Forms

Be aware that when putting code into the head of an Embedded form, that it may not load the same as a "parent" form. Specifically, it may load after you are expecting it to be available.

Also note that when you are using a REACT theme, all forms are embedded into the theme page. Thus, all advanced header code may load after the rest of the form is loaded and may not be available when you intend.

Where Not to Put Code

One of the reasons we recommend putting code into either the Custom Head Content or a Custom Event is maintainability. Those are logical places to put your form specific code. The one place we do not reccomend putting code is an HTML element.

HTML elements can have code (script tags), but it makes it hard for the next form developer to find code that is mixed in with other text features on a form. Also, code loaded in HTML elements may not be available or fire when intended based on the way the form loads.

Reusable Code

It's a common occurence for form specific code to be reused across multiple forms. Options like selecting the requested for or the desired location could be implemented across multiple forms. When this happens, it's recommended to move that code to your bundle and call it as a function from the form. Moving the code to the bundle helps with any maintenance issues. When changes need to be made to this code, it only needs to be done in one location instead of several (to dozens or hundreds) of forms.