Input Designer

Input designer lets you build a form in your App Integration. You can add fields to your form for every data your app needs from users.

Input Designer is required as it tells Eshopbox how to connect to your API, and create forms where users can input data to send to your API.

App integrations can use three types of fields:

1. Input Fields : It lets you choose from 10 other data types to let users enter plain text data and map variables from previous triggers and actions into the field.

2. Dynamic Fields : make API calls to your app, then show the returned data in a dropdown menu so users can select the item needed.

3. Line Item Group : organize a set of Input Fields to create line items, where each item in a comma separated list entered in the field would create a new separate item in your app, often used for line items in invoice and accounting apps.

Before you start

• You should have a partner login and a configured App.

How it works

1. From your Partner Dashboard

2. Go to App. All your created apps will be visible on this page.

3. Select a created app.

4. You will be redirected to the App detail page.

5. Click on the Extension.

6. To access Input designer, you can have following paths:

   1. Click on Actions tab. All created actions will be listed on this page.

      1. To create a new action

         1. Click on add Action

         2. Fill the core details

         3. Click on Save and continue

      2. To edit an existing action:

         1. Click on the edit button against the action you want to edit.

         2. Click on Input Designer tab.

   2. Click on Triggers tab. All created triggers will be listed on this page.

      1. To create a new trigger

         1. Click on add trigger

         2. Fill the core details

         3. Click on Save and continue

      2. To edit an existing trigger:

         1. Click on the edit button against the trigger you want to edit.

         2. Click on Input Designer tab.

7. You will be redirected to Input designer page.

8. Click on Add.

9. Select the field type:

   1. Input Fields : It lets you choose from 10 other data types to let users enter plain text data and map variables from previous triggers and actions into the field.
      Enter the following field details:

      1. Label: A user friendly name for the field

      2. Key: A unique identifier for the field(without spaces)

      3. Help Text: (optional) A 20 character or longer description that appears under the field label

      4. Type: Select from the following field types:

         • String: it is the default field type. Used to enter short text

         • text: Text fields are for longer text.

         • Integer: Integer fields are designed to gather integer number values

         • Number: Number fields can gather numbers with any value, including decimal points

         • Boolean: Boolean fields let users select between Yes and No values to set default settings in integrations, and return a corresponding 1 or 0 to your app. 

         • DateTime: DateTime fields let users enter dates and times

         • Password: Password fields work the same as standard string fields, except they hide the text entered in the field. 

         • Dictionary: Dictionary fields let users enter their own Key-value pairs, with a plain text name followed by a String field to enter or map data.
           eg: To add shipping address, name of the field can be Shipping Address and it’s type will be dictionary. Enter key value sets for multiple sub fields like addressLine1, city, state, pincode etc. You can click the + button on the right to add additional dictionary field entries as well.

      5. Default Text: (optional) Default value for this fields, if user doesn't map any value for this field.

      6. Options: (optional) Check the checkbox(s) if:

         1. Required: if the field is required

         2. Allow multiples: if multiple values can be added to this field

         3. Alter dynamic fields: If you check the Alters Dynamic Fields option on a field, Eshopbox will automatically recompute any dynamic fields in your Eshopbox integration anytime this field is changed.
            Say you have a field A that is only shown depending on the value of a previous field B. The B field should have the Alters Dynamic Fields option checked, then the A field should be a dynamic field with code to watch for the value of that field. Or, say your app lets users manage personal and work tasks, and add tasks to the correct project. You could first let them choose whether they’re adding personal or work tasks, and mark that field as Alters Dynamic Fields. Then you would add a Dynamic Field to your Input Form that uses this field and fetches the appropriate projects from your app.

         4. Dropdown: if the field should be a dropdown. Dropdown can be of 2 types:

            1. Static dropdown: To add a Static menu of choices, type the options in a comma separated list, with quotes around each item and square brackets around the set, such as: ["one", "two","three"]

            2. Dynamic dropdown: Eshopbox uses triggers to fetch the values for dynamic dropdown menus. Once you select dynamic dropdown, select trigger.

   2. Dynamic Fields : They are used to make API calls to your app, then show the returned data in a dropdown menu so users can select the item needed. Dynamic Fields let Eshopbox build custom fields from an API call, and run code that shows fields based on other input field data. Dynamic and custom fields are used to show user-defined fields from apps that must be fetched from the app when users build Automation workflows to let them use those fields. Steps to add dynamic field:

      1. In the code box, add custom code to make an API call and fetch the fields from your app. 
         Note: Have your code return the field key and names to Eshopbox in an array, to display in the user’s Automation.

   3. Line Item Group : organize a set of Input Fields to create line items, where each item in a comma separated list entered in the field would create a new separate item in your app, often used for line items in invoice and accounting apps.
      Enter the following field details:

      1. Line Item Group Label: Enter a user friendly name for what this line item group creates.

      2. Line Item Group Key: Enter a key for the group so Eshopbox can identify it internally.

      3. Line Items: Add input fields for each item to include in your line item group

         1. Click Add Line Item

         2. Add the input fields and fill in the input field detail form as mentioned earlier. These fields will show inside the Line Item field block.
            Note: You can’t set these fields as allowing multiples or altering dynamic fields.

10. Click Save and then repeat the process to add each field your trigger or action step needs.

GLOSSARY

Input fields

Dynamic fields?

Reference for UI:

Reference Docs: https://platform.zapier.com/docs/input-designer

Open

Open

Open

Open

Open