Forms

Overview

The Forms Management module enables Distributors to create and manage custom forms on the CloudBlue Connect platform. These forms are used to collect additional information from Vendors to perform the following operations:

1. Request additional data before a Vendor enrolls a Distribution Agreement.
2. Acquire Product-level information before a Vendor submits a listing request.
3. Get additional Item-level information before a Vendor submits a listing request.

Custom forms can be especially helpful for acquiring necessary information for various business scenarios. Example use cases include, but not limited to the following scenarios:

• Generating an Agreement type form to collect banking or finance information. Such data could be essential for creating and enrolling distribution agreements that should meet your business requirements.
• A Product type form can be used to specify support channels for Software-as-a-Service products. Therefore, your customers can submit questions or report occurring issues to relevant support agents.
• Creating an Item type form to specify different phone numbers for different items (SKUs). Thus, some customers can request certain items from one phone number and get different items from another number.

The following provides instructions on how to create and attach custom forms on the Connect platform.

Creating forms

Create a custom form on the Connect platform by following the steps below.

1. Start creating a new form

Click the Create Form button from the Forms module.

2. Define your custom form

Define your custom form within the following pop-up window:

• Name: Enter a name for your form.
• Type: Specify your form type.
  • Agreement: Select this type to get additional data before your Vendor enrolls a Distribution Agreement.
  • Product: Choose this type to request more Product-related information before your Vendor submits a listing request. Thus, Distributors can get specific Product data for certain Marketplaces (e.g., specific product description) 
  • Item: Select this type to acquire additional Items-related information before your Vendor submits a listing request. Therefore, Distributors can request specific Items data for particular Marketplaces (e.g., MSRP, detailed SKU description, Item dependencies, etc.) 
• JSON schema: Specify your custom form via the JavaScript Object Notation format. Refer to Schema Definition below for the instructions.

3. Save your custom form

Click the Save button to save your defined custom form.

Therefore, your defined custom form will be successfully created and saved within the Forms module.

Attaching Custom Forms

Once a custom form is successfully saved, Distributors can attach custom forms within a created Distribution Agreement.

The following steps showcase how to successfully attach your created form to your distribution agreement.

1. Access distribution agreement details

Click on your distribution agreement name from the Agreements tab of the Partners module to access the distribution agreement details screen.

Alternatively, click on your distribution agreement name under Distribution Agreements from the program agreement details.

2. Navigate to Details

Switch to the Details tab button upon accessing your distribution agreement.

3. Attach your created form

Click the Edit button next to your Attached forms. The following menu allows selecting your create Agreement, Product and Item custom forms via corresponding fields.

Once all forms are selected, click the Save button to save your attached custom forms.

Therefore, your selected custom forms will be attached to your distribution agreement. Your Vendor will be prompted to fill out your custom form before enrolling the distribution agreement and/or submitting a listing request.

Schema Definition

Custom forms are defined via the aforementioned JSON schema field. Each element in your custom form (input field, checkboxes, etc. ) must be described as a JSON element. Connect provides the form preview field that facilitates and rectifies your custom form creation. 

Following types of elements of the Form are currently supported:

Text Input

Basic text input field that is generally used to provide usernames, titles or any other data.

JSON Schema:

{
   "required":true,
   "type":"text",
   "id":"name",
   "title":"Name",
   "note":"Text field description"
}

Preview:

Text Area

The text area element, as the name implies, allows your business partners to enter text, hyperlinks, and also ordered/unordered lists. This element is often used for passing comments, feedback, notes, etc.

JSON Schema:

{
   "type":"textarea",
   "id":"notes",
   "title":"Notes"
}

Preview:

Checkbox

This element is used to create checkboxes that allow users selecting an option by ticking a box.

JSON Schema:

{
   "type":"checkbox",
   "id":"checkeable_options",
   "title":"Checkable options",
   "note":"Check box Note",
   "meta":[
      {
         "value":"option_1",
         "label":"Option 1"
      },
      {
         "value":"option_2",
         "label":"Option 2"
      },
      {
         "value":"option_3",
         "label":"Option 3"
      },
      {
         "value":"option_4",
         "label":"Option 4"
      }
   ]
}

Preview:

Dropdown

Creates a drop-down list with your specified values so that your business partners can select the option they want.

JSON Schema:

   {
      "id":"chooseable_options",
      "type":"dropdown",
      "title":"Selectable options",
      "meta":[
         {
            "label":"Option 1",
            "value":"option_1"
         },
         {
            "label":"Option 2",
            "value":"option_2"
         },
         {
            "label":"Option 3",
            "value":"option_3"
         },
         {
            "label":"Option 4",
            "value":"option_4"
         }
      ]
   }

Preview:

Description

Use the description element to add your required text between other elements from your custom form:

JSON Schema: 

{
   "id":"Description",
   "type":"description",
   "value":"**Bold Text** and new line:  \nAnother line of text"
}

Preview:

Section 

Divide elements into groups by using this element.

JSON Schema:

{
   "id":"section",
   "type":"section",
   "value":"Home Address"
}

Preview:

Static

This element allows adding a non-variable text string to your form.

JSON Schema:

{
   "id":"static",
   "type":"static",
   "value":"Static Text"
}

Preview:

Password

Use this element to add a password field to your form. This field can also contain your title, a note and the required check.

JSON Schema:

{
   "id":"password",
   "type":"password",
   "required":true
}

Preview:

Object Fields

Each element of the form can be described using the following attributes:

Property	Type	Description	Example
id	string	Identifiers are used to refer field data in the resulting object. Should be unique, alphanumeric, lowercase, separated by underscore.	field_01
type	string	Your field type should contain one of the following values: text, section, checkbox, etc. (for more details, refer to Schema Definition above).	password
title	string	Titles, as the name implies, are used to specify the title of your field. Note that titles are localizable.	Field title
required	boolean	If set to true, the provided field should be filled in before submitting the form.	true
filter	string	Regular expression to check data for validity.	/^[+]*[(]{0,1}[0-9]{1,4}[)]{0,1}[-\s./0-9]*$/
meta	array	Additional data for checkbox and dropdown lists.	[ { “label”: “Label 1”, “value”: “option_1” }, { “label”: “Label 2”, “value”: “option_2” }]
custom_error	string	Custom errors are used to show your message in case provided values do not meet your filter criteria.	Email should be in format login@domain.name
value	string	Default value of your provided field. It is generally used for the description or the section schema.	Default value
note	string	Additional explanation or instructions that are specified under your provided field.	Enter your password

Form Example

Use the following form as an example for your custom form:

[
   {
      "id":"name",
      "type":"text",
      "title":"Name",
      "required":true
   },
   {
      "id":"section",
      "type":"section",
      "value":"Home Address"
   },
   {
      "id":"email",
      "type":"text",
      "title":"Email",
      "custom_error":"Email should be in format login@domain.name"
   },
   {
      "id":"phone",
      "type":"text",
      "title":"Phone"
   },
   {
      "id":"static",
      "type":"static",
      "title":"Static Text"
   },
   {
      "id":"password",
      "type":"password",
      "required":true,
      "note":"Enter your password",
   },
   {
      "id":"checkeable_options",
      "type":"checkbox",
      "title":"Checkable options",
      "meta":[
         {
            "label":"Option 1",
            "value":"option_1"
         },
         {
            "label":"Option 2",
            "value":"option_2"
         },
         {
            "label":"Option 3",
            "value":"option_3"
         },
         {
            "label":"Option 4",
            "value":"option_4"
         }
      ]
   },
   {
      "id":"chooseable_options",
      "type":"dropdown",
      "title":"Selectable options",
      "meta":[
         {
            "label":"Option 1",
            "value":"option_1"
         },
         {
            "label":"Option 2",
            "value":"option_2"
         },
         {
            "label":"Option 3",
            "value":"option_3"
         },
         {
            "label":"Option 4",
            "value":"option_4"
         }
      ]
   }
]