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
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.
Last updated
