Skip to content

Developing UI Components

This document introduces you to the process of developing your own UI Components. It assumes you have a good knowledge and understanding of HTML, Javascript , CSS, Bootstrap, and AngularJS.

UI Components

UI Components are the individual building blocks that can be specified on a Template to control the overall presentation (and management) of data being displayed/captured on a form.

The Formbird platform provides a large set of UI Components to choose from (see the Components section of this documentation), and even more are available through the Formbird Store. It is also possible to create your own UI Components to fulfill a particular need.

Creating your own UI Components

The Component Editor template (5f6000a0-0828-11e6-9b64-1b27992111e1) provides the capability to create all sorts of UI Components. It is the same tool we use ourselves to create all of the UI Components available on the Formbird platform. It has been used to create UI Components that:

  • perform basic data capture/display (eg. sc-text-box, sc-drop-down)
  • work with document sets (eg. sc-data-tables, sc-uploader);
  • assist with form presentation (eg. sc-static-html);
  • wrap and access the functionality of third-party provided services such as Google Maps and Open Street Maps to capture and present geospatial data on maps (eg. sc-address-map) .

It is even possible to create UI components that contain no visible presence on a form, and are purely used behind-the-scenes to record data on a document (eg. sc-static-value).

The following documentation introduces the elements that make up a UI Component and how to define and utilize them to develop your own.