Dynamic Form

This tutorial covers the Dynamic Form component.

This component displays a form which is dynamically configured by the user. The form acts like a modal dialog box. It is typically used to trigger an action.

Unlike a regular data table, when the user edits the form there is no save bar that appears. There is also no way to save the form content for this component in this component itself. To do that, use the Form Data Table. For the Dynamic Form, there should be a submit button included, for which the programmer must define the action.

This component includes the following views:

• Form - This displays the form.

• Code - This should be used to enter a function body returning the form initialization info. For the format of the return falue, see the definition of the form initialization data in the ConfigurableForm documentation.

• Private - This allows for an private constants or functions needed by the function body initializing this form.

• Notes - This holds any desired notes for the component.

Example Form

The following example describes the workspace: Example Workspace

The code for this component should return a layout object. The layout object is a javascript/JSON object which gives the list of configurable elements and the initialization of each, defining the form.

The following code defines a form with the following elements:

• Title

• Text Field

• Radio Button Group

• Submit Element

To access this code, view the example workspace

The submit element is given callbacks that define the submit and cancel functions, which we have labeled "Submit" and "Reset". The functions are defined at the top of the code.

The function onSubmit uses the messenger to send the value of the form to the table myOutput.

The function onCancel resets the value of the form to the default value, which we defined at the top of the code.

The resulting form looks like this:

To see this in action, see the example workspace listed at the top of this section.

More Information

For more information about using the configurable form see the programming guide Configurable Forms.