Set up Contract Request / Intake Forms

How to Set up Standard Intake Form

Use the “Request Forms” tab to setup contract request forms. Here, you can build a new form by creating a new from by adding Form Components.

Contract Request (Primary Form)

When you first login, in the Request Forms tab, you will see a Contract Request form which is the Primary form. Use this Primary form as a base form and customize it by by dragging and dropping the form components. Upon completion, click the Save Form icon. To know more about the Form Components, refer here.

Note: The Contract Request form must always remain in the first position and cannot be deleted from the system.

Editing the Contract Request Form (Primary Form)

1. In the Request Forms tab, click View/Edit against the Contract Request form.

2. The following mandatory fields are present in the form.

   • Account

   • Contract Request Type

   • Estimated Deal Close Date

   • Description

   • Priority

3. Use the Form Components from the system to drag and drop the components onto the form. Alternatively, drag and drop the Nested Form component and embed a newly created form. To know more about the Form Components, refer here.

Form Components

Use the Form Components to design a form by dragging and dropping form components onto the form drop zone area. Components that are placed onto a Form will determine what that Form object looks like. The Component Settings is displayed when you drag and drop a form setting. To know more about the Component Settings, refer here.

• Text Field - A Text Field can be used for short and general text input. There are options to define input masks and validations, allowing users to mold information into desired formats.

• Email - The Email component is a string field that carries special input validation ensuring the entered data is in a valid email format. A valid email address consists of an email prefix and an email domain, both in acceptable formats.

• URL - The URL component is a string field that carries special input validation ensuring the entered data is in a valid URL format. Validation checks that the entered input is at least in the correct format to potentially be a legitimate URL.

• Text Area - A Text Area is a multi-line input field that allows for longer text.

• Number - Use a Number field whenever a field should be limited to a number value type.

• Phone Number - The Phone Number field carries an input mask to force the user to enter the field data in Phone Number format.

• Date & Time - The Date/Time component is a powerful and flexible component that offers many options for validation, date ranges, and calculations.

• Checkbox - A check box can be used for Boolean value input field. It can either be checked (true) or unchecked (false). There are options to set Shortcut and Input Type.

• Currency - Use the Currency component when a field should display currency amounts on the field. This component holds a numeric input mask that allows two decimal values and automatically adds commas as a user inputs a currency amount. The type of currency can also be selected which will change the prefix currency symbol.

• Select - Selectable values presented in a dropdown list where users can select one of the values. For dependent dropdown fields, see Dynamic Select Filtering.

• Radio - The radio component is a field that allows users to select a single option from a list of options displayed in radio-style format.

• Select Box - This multi-valued component allows users to select one or more options in checkbox style format.

• Content - A Content component may be added to a form to provide non-field information such as contextual language, headers, or media. For example, if you need instructions at the top of a form that are for display only, use the Content component.

• Columns - This component can be used for grouping other components, like Text Field, Text Area, Checkbox etc., into configurable columns. Use Columns if you want to display more than one component in one line or to save vertical space on your form.

• Field Set - A Field Set can be used to create a title for an area of the form or grouping of components. This is useful to put inside Layout components or in between lots of related components. The Field Set is for display only.

• Table - Create a Table with columns and rows that allow adding additional components within it.

• File - A File component allows users to upload and download files to a form. The File component connects the form to a file storage provider and allows the user to upload, view, and manage files. Supported file types are .csv, .doc, .docx, .efx, .efax, .eml, .htm, .html, .jpeg, .jpg, .pdf, .png, .pptx, .rtf, .tif, .tiff, .text, .txt, .xls, .xlsb, .xlsx, .xltx, .xlsm only.

• Review Page - The Review Page component presents form users with a summary of their data before submitting the form.
   
• AI Agent - The AI Agent component embeds intelligent automation directly into contract request forms, enabling real-time evaluation against internal guidelines, automatic information lookup, and dynamic form automation. Agent outputs can drive downstream assignment and auto-populate form questions based on conditional logic, providing instant responses for complex scenarios that would normally require manual processing.

Dynamic Select Filtering

Dynamic Select Filtering allows you to create dependent dropdown fields where the options in one Select field are automatically populated based on the selection made in another field. This is useful when you have hierarchical data relationships, such as Nation and City fields.

Note: Dynamically filtered fields cannot be used in automation rules or conditional logic settings. Use standard Select fields if you need these capabilities.

How to Configure Dynamic Select Filtering

Step 1: Create the Primary Select Field (e.g., Nation)

• Drag and drop a Select component onto the form and label it (e.g., "Nation")
• In the Display tab, set the Label and Placeholder
• In the Data tab, set the Data Source Type to "Values"
• Add your static values with both Label and Value properties
  Note the API Key (Property Name) from the API tab—you'll need this for the dependent field

Step 2: Create the Dependent Select Field (e.g., City)

• Drag and drop another Select component and label it (e.g., "City")
• In the Display tab, set the Label and Placeholder
• In the Data tab, set the Data Source Type to "Custom"
• Under "Refresh Options," select the primary field (e.g., Nation) so the City dropdown refreshes when Nation changes

Step 3: Configure Custom Values with JavaScript

• In the Custom Values section, write JavaScript code that filters options based on the primary field's value
• Reference the primary field's API Key (Step 1) and create filter logic:

values = [
{ label: "Chennai", value: "Chennai", nation: "India" },
{ label: "Bangalore", value: "Bangalore", nation: "India" },
{ label: "New York", value: "New York", nation: "United States" },
{ label: "Los Angeles", value: "Los Angeles", nation: "United States" },
{ label: "Sydney", value: "Sydney", nation: "Australia" },
{ label: "Melbourne", value: "Melbourne", nation: "Australia" },
];

if (!data.nation) {
return [];
}

return values.filter(v => v.nation === data.nation);

Key Point: Ensure the property name used in your custom values (e.g., "nation") matches the API Key of your primary Select field. This creates the dependency between the two fields.

Inline Component Settings

Edit

Opens the settings window for the component.

 

Copy

Copies the component JSON. When the Copy button is selected the Paste button will appear within the Inline Component Settings.

 

Paste

Pastes the component that was previously copied. The new component will be added directly below the component where the Paste button was clicked.

 

Remove

Deletes the component from the form. If a component is removed unintentionally, refresh the form to its previous state by navigating away from the form and selecting No for the Save prompt, or reloading the browser directly.

Component Settings

Display Settings

Settings that modify the front-end UI of a component. The Display setting tab will be the first tab open when editing the component settings.

AI Agent Button Components

• Agent - Select the AI agent that will analyze and process the form data. The chosen agent will execute its configured logic when the button is activated.
• Progress Message - Define the message displayed to users while the AI agent processes the request. This provides feedback during analysis and keeps users informed of the processing status. The default message is "Processing, this may take a minute!"
• Select Which Field Agent’s Response Should be Displayed In - By default, agent responses populate a designated response field. Use this setting to specify an alternative field where the agent's output should be displayed.
• Dynamically Populate Fields via Agent - Configure which form fields the AI agent should automatically populate based on form inputs and intelligent analysis. The agent will fill these fields according to the logic defined in its configuration settings.
• Button color - Select the visual color scheme for the AI agent button to match your form's design and branding requirements

Label

The front-end name for the component. By default, the label will display left-aligned, above the field.

Label Position

The label location of the component. The Label Position will default to the Top option, but several other options can be selected:

• Top - The Label will display left aligned on the top of the component

• Left (Left-aligned) - The Label will display to the left of the component and aligned to the left of the component width span.

• Left (Right-aligned) - The Label will display to the left of the component and aligned to the right of the component width span.

• Right (Left-aligned) - The Label will display to the right of the component and aligned to the left of the component width span.

• Right (Right-aligned) - The Label will display to the right of the component and aligned to the left of the component width span.

• Bottom - The Label will display left-aligned below the component

When the Left or Right alignment options are selected, padding is added to the respective position of the component. The padding will create space between the label and the component.

Note: Use the label position when formatting your form in a grid-like fashion or to save vertical space on your form.

Hide Label

Hides the label of a field. Save vertical space on a form by hiding the field label and utilizing other display settings such as a Placeholder to identify the field.

Disabled

The Disabled setting will prevent users from focusing and inputting data into the field. Use Disabled fields in conjunction with Calculated Values to prevent a user from altering calculations or populated values.

Placeholder

A short descriptive text that describes the expected value that the user should enter in the field. The Placeholder will display when the field is empty and will not be submitted to the server when the form is submitted.

Note: Use the Placeholder as helper text for users filling out the field.

Tooltip

Adding content to the Tooltip setting will add a new UI element to the field represented by a question icon. The content inside the Tooltip setting will display when a user hovers over the UI element. Tooltips are a great way of providing detailed instructions or helper tips without taking up space on your form.

Note: Use HTML in the Tooltip setting field to style the content inside the Tooltip.

Hidden

Hidden components do not display on the form but are still part of the form submission. Configure Logic with Hidden components to facilitate conditional show and hide workflow.

Description

Add a Description that will display below the field. This setting can be used as an alternative to the Placeholder or in addition if further details are needed for the field.

Note: Use HTML in the setting field to style the content of the Description.

File Settings

With Supported File Types, you can easily dictate the allowed file extensions right from your Settings menu. Simply set your preferences, and voilà – any files not matching your specified patterns will be blocked from upload, ensuring a streamlined and secure experience for your team.

For example, a legal admin can set the file upload settings to accept only PDF files as evidence for email approval.

Data Settings

Data settings mostly relate to how data is set or how data is interacted with between fields. Use Data Settings to set a default value or set up data calculation.

Multiple Values

The Multiple Value settings adds a 'Add Another' button below the field and allow the user to add or remove multiple instances of a component. Data is saved as an array within the submission.

Default Value

Sets the default input value for the field which will display in the field when the form is rendered. If left unchanged, the default value data will be saved with the submission.

Custom Default Value

This provides a way to set the custom default value of the component you are currently configuring. The default value is the value that is used at the initialization of the component and provides you an opportunity to set the initial value of the component, but also provides a good point to place any initialization code you may wish to add to the component.

Example: Set custom default value to the combination of other fields.

value = data.firstName + " " + data.lastName;

Calculated Value

Expand the Custom Default Value tab and write custom Javascript or JSON logic to set up calculation logic on the field.

FAQs on how to use Calculated Value

What are Calculated Values?

Calculated Values allows form designers to write custom javascript to facilitate calculation of data input between fields on a form.

Why should I use Calculated Values?

A common requirement for modern web forms is business based calculations between fields on your form. Whether you're creating order forms, quote request forms, payroll forms, and the like, Calculated Values equips you to satisfy complex calculation requirements for modern web forms necessary in today's industries.

How do I use Calculated Values?

To apply field calculations, open the component settings and click the Data tab. Scroll down the settings window and click the Calculated Value panel and add your Javascript code.

Example 1

By incorporating calculated values into your form, you can automate the process of deriving meaningful insights from the submitted data, to save time and effort compared to manually performing calculations on the collected information.

For example, to calculate the “Total Price” based on the “Quantity” and “Unit Price” captured in the form, do the following steps:

1. Drag and drop two Number components to the form and in the “Display” tab, Label them as “Quantity” and “Unit Price”.

2. Drag and drop another Number component to the form and in the “Display” tab, Label this as “Total Price”

3. Click the “Data” tab and expand the Calculated Value section.

4. In the JavaScript box, type the following: value = data.Unit Price * data.Quantity

5. Click Save.

Example 2

In the following example, we are going to set up Javascript calculation between three fields and populate that data into a 'Full Name' field on the form.

Use the value function to start the line of code. Next, add the data variable and reference the Property Name of the fields you wish to calculate. Use empty single quotes to apply spaces between the calculated values.

value = value = data.firstName + ' ' + data.middleInitial + ' ' + data.lastName;

Note: When referencing a field, use the Property Name of the referenced field in your code. The Property Name is found in the API tab of the component settings.

Why does the sum not display as blank when one of the input values is empty?
For instance:

• List Price 1 = 1000
• List Price 2 = 3000
• List Price 3 = [blank]

To resolve this issue, you can use the following formula:

value = (data.listPrice1 || 0) + (data.listPrice2 || 0) + (data.listPrice3 || 0)

Clear Value When Hidden

Clears the field value if the field becomes hidden on the form. This setting is on by default and is the typical value behavior you would when showing/hiding components. Uncheck this setting if the field value should be retained and subsequently re-displayed when using conditional logic.

Allow Manual Override for Calculated Value

This setting puts you in control, allowing you to override calculated values with your own inputs. By default, field values cannot be entered manually when a calculation is applied. Activate this option to allow users to override calculated values with their own data inputs seamlessly.

For instance, let's consider the "Total Contract Value" field, which is typically calculated by summing up various components like base fees, recurring charges, and any applicable discounts.

By default, this field would automatically calculate the total value based on the inputs provided for each component. However, if the "Allow Manual Override" option is checked, users can override this calculated value and input their own figure.

For example, if there's a negotiation with the client resulting in a special one-time discount that isn't reflected in the standard calculation, the user can manually enter the adjusted total contract value. This ensures flexibility in situations where manual adjustments are necessary due to unique circumstances or exceptions not covered by the standard calculation rules.

Validation

Settings found in the Validation Tab relate directly to the configurable Front-End and Back-End validations for the field. Validation cover settings such as required fields, unique data, min/max requirements, custom validations, and custom error messages.

Validate On

Determines when the field's front-end validation will occur based on the option selected:

Change - Validation will actively trigger any time there is a change in the field. This is the default option for every field.

Blur - Validation will only trigger when the field is no longer focused.

Required

Value is required within the field before the form is submitted or the user progresses to the next page of a Wizard form.

Custom Validation

Custom Validations allow you to write a snippet of JavaScript that decides how the component should be validated as well as what error to show when the evaluation is determined to be invalid. This can be achieved using the following additional context variables exposed to the custom validation section.

Variable	Description	Example
input	The value that has been input into the component that is being compared for evaluation.	valid = input === 5;
valid	A special variable that determines if the component is valid. If the value is set to "true", then the component is valid. Otherwise you would set the value of "valid" to the string you would like to show the user when it is invalid.	valid = input === 5 ? true : 'The value must be 5!';

Example 1: Validate that this "validate password" field matches the "password" field.

valid = input === data.password ? true : 'Passwords must match!';

Minimum / Maximum Length

The Minimum or Maximum length requirement the field value must meet. This behavior changes depending on what component the setting is being applied to.

String (EG Text Field, Text Area) - Determined by the number of characters entered in the field.

Number - (EG Number, Currency) - Determined by the numerical amount entered in the field.

Array (EG Data Grid, Edit Grid) - Determined by the number of arrays added to the component.

Note: Use the Minimum / Maximum length on Data Grids or Edit Grids to determine the number of rows a user can add or remove.

API

Component settings found in the API Tab contain Back-End settings such as the field's Property Name.

Property Name

The back-end field identifier for the API endpoint. This field is auto-populated in camelCase based on the initial Label given to the field. Each field's Property Name must be unique on the form before the form can be saved.

Note: Use the Property Name when referencing the field via API or conditional logic.

Conditional

The Conditional Show or Hide feature allows the form designer to apply conditional logic to a field. Using conditional Show or Hide, you can control what fields will display based on the user input on other fields.

Use this option to trigger a condition based on the data input of a single field on a form. There are three settings to configure when setting up a condition:

Show or Hide this field: Select whether you want the field to Show or Hide the field when the conditions are met.

When: Select whether you want to show or hide the field when One or All conditions are met.

Conditions: The Condition section is the workflow that will execute the settings mentioned above. When the +Add Condition button is clicked, the following fields will be available to configure the condition:

• When: Dropdown to Select what component in your form will execute the condition.
• Is: Operator settings that determine what the status of the field value should be before the condition is executed.
• Value: The data entry of the field to execute the condition. When the conditional field has static values, like the Radio or Select components, those options will be available within a dropdown field to select as the Value.

Note:

• When configuring a condition based on value selection fields (Radio, Select, Select Box), ensure you are using the Value and not the Label when setting the value inside your condition, as shown in the image below.
• Use multiple Conditions in conjunctions with the When setting to facilitate advanced conditional workflows

Example on how to use Conditional Logic

Setting Conditional Logic for a Field. For example, setting a conditional logic for the “Contract Value” field will be displayed in the form only when the “Contract Request Type” = Sales Order. The following fields must be updated in the Conditional tab in the Contract Value field.

1. Show or Hide this field: Show
2. When: When any condition is met
3. Click Add Conditions.
4. When: Contract Request Type
5. Is: Equal To
6. Value: Sales Order

Advanced Conditions

Unlock the power of JavaScript or JSON by writing custom conditional code. Use this option when more complicated or specific conditions are required in the workflow, like when the conditional relies on a sub-function within the Javascript code comparing different values. This provides the user with the freedom and flexibility to write complex conditions as they see fit.

Before writing your Javascript it's important to note the available variables:

form	form The complete form JSON object
submission	The complete submission object
data	The complete submission data object.
row	Contextual "row" data, used within DataGrid, EditGrid, and Container components
component	The current component JSON
instance	The current component instance.
value	The current value of the component.
moment	The moment.js library for date manipulation.
-	An instance of Lodash.

Use the show function to start your line of JavaScript when conditionally showing or hiding. In the following example, this conditional field will display when the Currency field has a value greater than $100000. There's also a sub-function that will show the field when the previous condition is met and the Radio field has the value 'Corporation' or 'Enterprise':

show = (data.contractValue > 100000) & (data.businessType == 'enterprise' || data.businessType == 'corporation');

How to Setup Self Service Forms

Self service forms can be utilized to streamline and automate various aspects of the Pre-signature process. These forms allow users to initiate or complete specific actions quickly and efficiently. To setup a Self Service Form, refer here.

Frequently Asked Questions

Q: What does the Hidden setting do?

A: When a field is marked as Hidden, it is completely invisible to users — it won't appear on the request form, and it won't appear in the request details either. Use this when the field should not be seen at any point in the workflow.

Q: What does the Disabled setting do?

A: When a field is marked as Disabled, it is visible but not editable. The field will appear on the request form (in a read-only state), and it will also show up in the request details. Use this when users need to see the field, but should not be able to modify it.