Overview

In this example, we will create a form that pulls specific information from a customer contacts table that a user is looking for.

Prerequisites

• Before creating a form, you must have the CLI package set up in your environment​

• You must also have installed and configured the Meta-Forms experience​

Create your Form

This example uses a form to pull information about contacts from specific table and display it in the forms experience. You can also use a form to push data to a connected table. See: Step 5, Creating New Records.

1. Navigate to the Forms table by searching for "Forms" on the homepage (Image 1).

1. Fill out the following sections of a new row (Image 2):

• Table: For a pull request, this will be whichever table you want to be receiving information from. This example uses the Contacts table.

• Name: This will be the name of your form. This example uses Contacts Form (Example Test).

• Display Name: You may enter an alternative display name if you wish

• Brand: Select a branding colour. This example uses light green.

• Is Accordion: Select whether you want your form to appear in accordion format or not.

• Lookup Label: This option will select how you pull information from your assigned table. This example selects the Contacts.People.Name column from the Contacts table, to pull information based on a contact name.

• Owner Groups: Select which groups have ownership of the form. This example uses the Product Success group.

• User Groups: Select which user groups have access to the form. This example uses the Product Success group.

• Bookmarked Users: If you want this form to appear in your "My Forms" view on the Forms table, enter it here.

Set up the Form sections

The next step is to set up your various form sections. These act as the headers of the form, and help organize your information. This example creates a section to pull information from the Profile, Contact Info, and Company sections of the Contacts table.

1. Navigate to the Form Sections table by searching for Form Sections on the homepage (Image 3).

1. You will fill out a new row for each form section you want, filling out the following (Image 4):

• Form: From the drop down, select the name of the form that you just created. In this example, that would be Contacts Form (Example Test).

• Sequence: Use this section to dictate the order in which your sections appear on your form, with 1 appearing first.

• Name: Enter the name of your field. This example has Profile for the first row, Contact Info for the second, and Company for the third form section row.

• Columns in Row: Enter in how many columns you want to appear for this section. This example uses 1 column for the Profile section, and 2 each for Contact Info and Company.

• Auto Expand: Check this box if you want your sections to auto expand when someone opens the form.

Set up the Form fields

The final step of form creation is to populate the Form Fields section.

1. Navigate to the Form Fields table by searching for Form Fields on the homepage (Image 5).

​​2. Populate the following sections (Image 6):

• Form Section: Populate this column with the fields that you created in step 2 (Profile, Contact Info, and Company). You must populate Contact Info and Company in two separate columns as this example uses 2 as the value for the "Columns in Row" variable in step 2.

• Sequence Override: You may input an override to the sequence order here if you desire.

• Tale Column: This is where we link to the column that's storing the information we seek. In this example, we link to the Customer Contacts table, and specifically to the section for Name, Email, Work Phone, Company, and Website.

Test the Form

1. You can open your form by clicking on your Form Name > Open.

2. To populate our example form, select a record from Select Existing Record. The information will automatically populate in your form fields (Image 7).

Create new records

Your form can both pull information from an existing table and push information to that same table.

1. On the left-hand navigation pane, click on Create New Record (Image 8). The information that you populate and save into the form here will automatically be reflected on the connected table.

Add the Form to the home page

1. To add your form as an applet that users can bookmark and access, navigate to the Cinchy Applets table.

2. In a new row, fill out the following information:

• Domain: The domain that your form sits in.

• Name: The name of your form/applet. In this example we use Contacts Form (Example Test).

• Icon: Select an icon for the widget.

• Icon Colour

• Description: Add a description for your applet.

• Target Window: Select if you want you form to open in a new window or not.

• Application URL: Add in the URL to your form here.

• Users and Groups: Add in which users/groups can access your form in these columns.

Overview

This page outlines how to create a form using the Form Designer, a simple alternative for making your forms.

Prerequisites

• Before creating a form, you must have the ​

• You must also have

Create your Form

The Form Designer helps create new Forms intuitively using the Forms experience itself.

This example creates a Contacts Form (Example Test) form to pull information from the Contacts table.

1. Navigate to the Form Designer experience from the homepage (Image 1).

1. Open up the experience and it should look like this (Image 2):

1. To create a new form, click the Create New Record button on the left-hand navigation pane (Image 3):

1. In the Form Definitions section, fill in the following information and click Save once done (Image 4):

• Table: This will be the table that you want to push/pull information to/from. This example pulls information from the Contacts.People table.

• Name: The name of your form. This example uses Contacts Form (Example Test)

• Display Name: Enter a display name for your form. This example uses Contacts Form (Example Test)

• Lookup Label: This option will designate how you pull information from your assigned table. This example designates the Contacts.People.Name column from the Contacts table, to pull information based on a contact name.

• Is Accordion: Select this checkbox if you want the form to open in accordion format or not.

• Brand: Select a branding colour for this form.

1. Once your Form Definitions are set, the Form Sections tab will open (Image 5).

1. Click on the + to add a Section Definition to your form (Image 6).

Add Form sections

You can now add your Form Sections. This example adds three sections: Profile, Contact Info, and Company.

1. Fill in the following information and select OK when done (Image 7):

• Name: Add in your section name. This example uses Profile, Contact Info, and Company,

• Sequence: Select the sequence that this section will show up on the form. 1 means it will show up first.

• Columns in Row: Select how many columns you'd like to appear in the row. This example uses 1 for the Profile section, and 2 for the Company and Contact Info sections.

• Auto Expand: Check this box if you want to the section to auto expand.

1. Click Save.

2. Within the Actions column of each of your sections, click on Design to navigate to the Form Section Designer.

3. Navigate to the Section Fields tab (Image 8).

1. Click on the + in the Fields tab to add a new Section Field. This example adds two fields to the Contact Info section of the form (since we designated it to have 2 columns per row in step 7).

2. Fill out the following sections and click OK when finished (Image 9):

• Table Column: The column you want to pull from/push to in this field. This example uses Contacts.People.Email and Contacts.People.Work Phone.

• Name: Select a name for your section. This example uses Email and Work Phone.

• Sequence Override: You can choose to override the sequence in which this section appears on the form, with the section listed as 1 appearing first.

• View Only: Check this box if you want this section to be viewable only.

1. Click Save.

2. Navigate back to your Forms Table, click Open, and it will appear with your sections and fields (Image 10):

Add the Form to the Homepage

1. To add your form as an applet that users can bookmark and access, navigate to the Cinchy Applets table.

2. In a new row, fill out the following information:

• Domain: The domain that your form sits in.

• Name: The name of your form/applet. This example uses Contacts Form (Example Test).

• Icon: Select an icon for the widget.

• Icon Colour

• Description: Add a description for your applet.

• Target Window: Select if you want you form to open in a new window or not.

• Application URL: Add in the URL to your form here.

• Users and Groups: Add in which users/groups can access your form in these columns.

​​

Overview

Customize the appearance of your text in Forms with our new rich text editing capabilities. Enabling this on your text columns will give you access to formatting options for text previously unavailable in Forms such as:

• Bold, Italic, Underlined text

• Checklists

• Headers

• Code Blocks

• etc.

You have the option to output the data as HTML.

Enable rich text editing

You can enable rich text editing on your Form text columns through the Design Table tab of your form table (Image 1).

• Enable text formatting: Checking this enables the rich text editor in Forms.

• Save text as HTML: If you need the data saved from the rich text editor to be in HTML format, check this box.

• Max Characters: The rich text editor saves data in Cinchy as structured data (or HTML), which is much more verbose than your actual text. This number should be at least 10,000 characters.

Use the rich text editor

Once you have enabled rich text editing on your text column for your form, you can use the capabilities by navigating to your form applet.

You will see all the formatting options available to you in the editor toolbar (Image 2). A form field that doesn't have rich text enabled appears like the "Plaintext" section below.

Examples

The below section outlines some examples of what you can do with the rich text editor.

Example A

The below example (Image 3) shows using the following rich text capabilities:

• Bulleted Lists

• Bold

• Italics

• Underlined

Example B

The below example (Image 3) shows using the following rich text capabilities:

• Headings 1, 2, 3

Example C

The below example (Image 4) shows using the following rich text capabilities:

• Linking

Output

As you can see below, the text you enter into the Rich Text Editor is saved as structured data (Image 5), and when the "Save text as HTML" option is checked in your column settings, it's saved as HTML (Image 6).

Add a link to your form

Currently, form links will only populate on existing records. They won't appear on a blank form.

To add a link to your form:

1. Navigate to your source table. In this example we will use the "Product Content Backlog" table (Image 1) for our "Product Content Requests" form.

1. Add a new column to your table using the following parameters (Image 2):

• Data Type: Text

• Default Value: You can set this to your link if you want a single URL to populate as the default. This value can always be updated in the table.

• Max Length: 500

• Allow Linking: Yes

1. Add in your URL to your relevant row/record.

2. Add this column to your form by navigating to the Form Fields table and inputting your new column as a row (Image 3).

• Under Data Format Type, select LinkURL.

1. When you navigate to the form record linked to your row in step 3, you will see the URL populated as below (Image 4):