Cloud Managed Network (Meraki) - JSON Forms

When you automate and orchestrate with Itential, you have the option to run things from other systems or directly from our Operations Manager Automations.  You also have the ability to orchestrate use-cases integrating to other systems in order to perform tasks and/or pull data that your automation needs.   In this exercise, we will start the automation with user input from a JSON form, which we will build in this section of the course.  

JSON Forms Video

Step 1

From the IAP Dashboard, select Automation Studio.

Step 2

From Automation Studio, select the + in the left navigation panel.  The Create window will open.

Step 3

From the dropdown, select JSON Form.

Step 4

Enter the name Lab – Meraki – XX and click Create.

Step 5

JSON Forms utilize a drag and drop interface.  Click to expand the Layout menu in the right navigation panel.  There are 3 layout elements, which are used to group elements and provide unique data structures.  Click to expand the Form Elements menu.  There are 7 types of form elements to choose from.  Form Elements are used to provide fields that capture input values.  

 Step 6

The first element our use-case will use is a Text Input.  Click and drag a Text Input form element to the canvas where you see the text Drop elements here.  When the element reaches the canvas, a red box will appear indicating where the element will be placed.

Step 7

Once the element has been added to the form, an ellipses icon will appear in the top-right corner.   Hover your cursor over the ellipses icon and a gear icon will appear.  Click the gear icon to open the Configuration window.

Step 8

For the Label, enter Organization Name.  We would like this element to be required, so we will select the Yes radio button for Required.  This element will also be Read-Only, so we will select the Yes radio button for Read-Only.  Update the Placeholder to Enter an Organization Name.  

Click Save.   The initial configuration has been added.  

Step 9

The last thing we need to configure is the Read-Only value.  For the Organization Name, enter Itential Workshops as the default value. The Text Input element has been configured. 

Step 10 

Add a second Text Input element to the canvas and open the configuration window.

Step 11

For the Label, enter Network Name.  Select Yes for Required and update the Placeholder to Enter network name.  Click Save.

Step 12

Add a Text Area element to the canvas and open the configuration window.

Step 13

For the Label, enter Network Notes.  We would like to use a Custom Key for this element, so we will select Yes for Custom Key.  Custom keys allow us to show one value for the field label and use another value as the variable submitted to the workflow.  For the Custom Key, enter notes.  Select Yes for Required and update the Placeholder to Enter some notes about the network.   Click Save.

JSON Forms Video - Part 2

Step 14

Add a Dropdown element to the canvas and open the configuration window.

Step 15

For the Label, enter Time Zone.  Select Yes for Custom Key and enter timeZone.  Select Yes for Required and update the Placeholder to Select a time zone.  Notice the warning telling us that Options are needed.  The Dropdown element requires options as part of its configuration.  Select the +Options button in the bottom right of the configuration window.

Step 16

There are 2 options for dropdown values, Static and Dynamic.  Static options will not change once they are populated.  Dynamic options can change and are populated with an API request.  For this dropdown, we would like to use Static options.

Step 17

This dropdown will have 4 static values.  Click the +Option button 4 times to add 4 values.  The Option Value we enter is the format that our workflow needs in order to run.  The Custom Label allows us to show a user-friendly value in the dropdown.   Configure the 4 static options as follows. 

•  America/Chicago for the Option Value and Chicago for the Custom Label
• America/Denver for the Option Value and Denver for the Custom Label
• America/Los_Angeles for the Option Value and Los Angeles for the Custom Label
• America/New_York for the Option Value and New York  for the Custom Label

Step 18

Click Back.  Notice the options message has changed.  Click Save.  The dropdown has been configured.

Step 19

From the Layout menu, click and drag a Table to the canvas.  This will be used to provide a data structure to our next element.  

Step 20

For the Table name, enter Tags.

Step 21

Click and drag a Text Input element into the table where you see the text Drop elements here.

Step 22

Hover your cursor over the ellipses icon in the Text Input element and click the gear icon to open the configuration window.

Step 23

For the label, enter Tag and select No for Required.  Update the Placeholder to Enter a tag and click Save.   The Text Input element of the Table has been configured.

Step 24

Add a Dropdown element to the canvas and place it below the table.  Open the configuration window.

Step 

For the Label, enter Product Types and select Yes for Required.  We would like the user to be able to select more than one product type, so we will select Yes for Multi-Select and enter 1 for the Minimum Items.  Update the Placeholder to Choose one or more types.  Click +Options.

Step 25

Ensure Static is selected and click +Option 3 times to add 3 static values.

Step 26

Enter the following values for the Option Values and Custom Labels; appliance, switch, and wireless.

Click Back and then click Save.

JSON Forms Video - Part 3

Step 27

Add another Dropdown element to the canvas and open the configuration window.

Step 

For the Label, enter Claim Devices.   Select Yes for Custom Key and enter serials.  Select Yes for both Required and Multi-Select and add a Minimum Items value of 1.  Click +Options.

Step 28

This time, we would like to populate our dropdown values using an API request, so we will select Dynamic.

Step 29

We need to configure the API call used to populate our Dropdown field.  For the Request Method, select POST.  For the Base URL, select /Meraki and for the API Route select /getOrganizationInventoryV2.

Step 30

Copy the JSON data and paste it into the Request Body field.  Click Make API Call.  This will send the API Request and the response will appear in the Response Body field.

{
"id": "627126248111354170",
"queryVars": {
"usedState": "unused"
}
}

Step 31

Next, we need to choose which data point will be used for the values in the Data Mapping section.  For the Source Property, select /response.  For the Property Key, select /serial.  Click Query Data.  The Meraki devices are shown and will be populated as the dynamic dropdown values.

Step 32

In the Dropdown Label section, select Value as Label.  Click Back and then click Save.   The dropdown has been configured.

Step 33

The last element we will add is a Text Input element.  Add the element to the canvas and open the configuration window.

Step 34

For the Label, enter Meraki Adapter.   Select Yes for both Required and Read-Only and click Save.

Step 35

Our last step is to add our Read-Only value.  For the Meraki Adapter element, enter Meraki as the default value.

Step 36

Our JSON Form is complete.  Click Save.

Step 37

We would like to preview the format of the data leaving the JSON Form.  Click the Preview icon.

Step 38

Complete the form using the following values: 

• Organization Name: Itential Workshops
• Network Name: Workshop Test – XX
• Network Notes: enter any notes
• Time Zone: select any time zone
• Tags:  enter any tag
• Product Types:  Choose at least 1 product type
• Claim Devices:  Choose either or both devices
• Meraki Adapter: Meraki

Step 39

Click Show Form Data.  This is the format in which the data will be submitted when executing our automation in Operations Manager.  Notice the timeZone value is submitted as the Value instead of the Custom label.  You’ll also notice that timeZone, serials, and notes are the Custom Key values rather than the labels.

At the top of the form data, hover your cursor next to the text 8 items and select the clipboard icon.  Paste the JSON text into a text editor, such as Notepad, for use in the next section of the training.

Click Close.

Step 40

We know that users will be submitting data using our form, but when doing so, the values are not sent to the workflow individually, they are sent in as a single variable called formData. To extract the individual values, we need to transform the data. To do that we will build a Transformation.