Methods

# inner GenericForm(props) → {React.ReactElement}

The generic form component

Parameters:

Name	Type	Description
`props`	`object`
`formTitle`	`string`	The title of the form
`headerTitle`	`string`	The title of the header
`cancelUrl`	`string`	The url to navigate to when the user cancels
`successUrl`	`string`	The url to navigate to when the user successfully submits the form
`isEdit`	`boolean`	Whether or not this is an edit form
`defaultValues`	`object`	The default values for the form
`layoutOptions`	`object`	The layout options for the form
`twoColumn`	`boolean`	Whether or not to render the form in two columns
`domainUrl`	`string`	The url for the domain
`unitLabel`	`string`	The label for the unit
`helpText`	`string`	The help text for the form
`submitUrl`	`string`	The url to submit the form to
`alternatingCols`	`object`	Whether or not to alternate the columns
`iconOptions`	`object`	The options for the icons
`formatPayload`	`function`	A function to format the payload before submitting
`onSuccess`	`function`	A function to call when the form is successfully submitted
`suppressSuccessToast`	`boolean`	Whether or not to suppress the success toast
`suppressErrorToast`	`boolean`	Whether or not to suppress the success toast
`formatSubmitMessage`	`function`	A function to format the success toaster message
`formatSubmitError`	`function`	A function to format the error message (sends the error as a parameter and true if it came from the server)
`asyncOptions`	`object`	The options for the async select fields
`hideEmptySections`	`boolean`	Whether or not to render sections that have no visible fields
`cancelColor`	`string`	The color of the cancel button
`submitColor`	`string`	The color of the submit button
`editColor`	`string`	The color of the edit button

View Source stories/GenericForm.jsx, line 23

Returns:

- The component

Type: React.ReactElement

Example

//example of choiceFormatter function
const choiceFormatter = (fieldId, res, otherOptions) => {
  const { mappedId } = otherOptions || {};
  return res?.data?.map((opt) => {
    const id = mappedId && opt[mappedId] ? opt[mappedId] : opt.id || opt.streamID;
    return { id, label: opt.name || opt.label }
  })
}