Making Dynamic Forms

Now that we have a solid inspection report, let’s make it dynamic. Today, we’re going to learn how to make forms dynamically show questions based on previous responses.

Learning concepts in this Skill Station:

Editing inspection forms
Showing and hiding form elements
Adding conditions that show or hide elements
Editing scoring expressions to accommodate dynamic form fields

Video Tutorial: 

 

 

Start by accessing our Stream Definition canvas. Unlock your stream.

Let's revisit our inspector use case. Our inspector is responsible for a region of locations that require regularly-timed, visual inspections. Some of those locations may include plants with conveyor belts, which come with special PPE requirements. Other locations may not have those. When inspecting locations, we’d rather not see questions on the form if they are not relevant.  Let's learn how to show and hide questions with dynamic forms.

Let's revisit our PPE requirements checklist.

safety-inspection-checklist-preparedness-ppe-requirements

Notice that question 8 is about conveyor belts. The next two are about loose clothing and jewelry. Those two questions aren’t relevant if there is no conveyor belt at a location. So let's hide those unless there is a conveyor belt at the location.

Editing inspection forms to show and hide form elements

Go to your Stream Definition canvas to edit the Inspection Form. On the right side of the screen in the Components Catalog, hover your mouse over the Inspection Form to reveal the “edit” function. Click edit.

s6-safety-inspection-form-find-it

In the Inspection Form, you will see the 4 pages we created earlier in the Web/Mobile layout tab. Select the PPE Requirements page to see the those checklist questions. Double click the question about conveyor belts.

conveyor-belt-ppe-rquirements

In the Edit Field popup, click the Show/Hide Form Elements tab.  On this tab, we will specify the conditions that will make questions show on the form. Yes, you can have multiple conditions.  When an inspector checks yes to the conveyor belt question, we want to show the follow up questions about jewelry and torn clothes. If they clicks no, that there is no conveyor belt, we want to hide those questions. To do that, check the box next to the word Yes to indicate that when the condition, or answer to that question, is yes, then we want the other questions to be shown.

In the field below, called Show following … we are going to tell Pulpstream which follow up questions to show. Click on the pull-down menu to find the questions about jewelry and loose clothes. Notice that you can show or hide a complete tab, a section, or just a question. You can also mix and match. After those two questions are in the Show text box, click the box next to Make Shown Fields Required, so the inspector has to answer those.

Note: We could have accomplished the same thing, by doing the exact reverse. If we specified that when “no” was chosen we wanted those two questions hidden, we could do that.  
At the bottom of this popup, there’s also an option to show all the questions when the form loads on a screen. To do that, you would check that box next to the Initialize form… statement. This is helpful to know when you have more questions to show than you want to hide. Options are great, right?

When you are done, your tab will look like this:

safety-inspection-form-edit-show-hide-form-elements

Save your changes to this tab.

Adding conditions that show or hide elements

On the Conditional Selections tab, we are going to take away the “not applicable” option from those 2 follow up questions, because if conveyor belts are present then N/A isn’t a valid option for those questions. Under the change options of selected fields… check the yes box. In the change the options of... field, make sure the first follow up question is selected in the pull-down menu. Uncheck the N/A box. The yes and no boxes should be checked.

Add another field for the second follow up question. Click on the blue text on the bottom of that popup to accomplish this. Under the change option... title check the box next to yes. Select the second question in the pull-down menu. The boxes next to yes and no should be checked. The N/A box should not be checked.

The Conditional Selections tab should look like this when you are done:

conditional-selections-tab

Save the page changes. Save your changes to the Inspection Form. Enter some notes about what we did for the change logs. For example, "Added hide /show conditions for PPE requirements checklist on Inspection Form.”

Editing scoring expressions to accommodate dynamic form fields

Since we were working on an unlocked version of our work stream, we can go to our home page and test it. Go through the inspection and see what happens.  We are going to need a record to test later, so you should actually do this now.

submit-a-new-form-inspections-safety

Now that we have created a test record, go to Your Records and click on the Submitted by You tab. Select the record you just created with your test. You’ll see that it’s gone into a red, error state.

error-in-your-records-w-4-errors

So what’s going on here? And what do we need to change?  Click on that red error to see the Error Log and find out what happened. This error tells us that the error is in calculating PPE scores. Looks like we've got null values jamming up our stream.

error-log

Where are they? On the right side under Milestone Progress, click on the "show flow diagram" text. This will discern which step in our work stream needs to be debugged. The one highlighted in red is the one with the error. That’s our Calculate Score step.

process-error-log

If you have multiple streams being edited and used, and you are not sure which stream version contains the error, you can discern this by going to Your Streams Summary tab.

version-error

Now that we know exactly where the error is, let's go back to our Stream Definition canvas and open our Calculate Score step to resolve the problem. We need to inspect our PPE Scoring expressions. Earlier we created an expression that adds up the scores for all the questions in our checklist. After editing the way checklist question 9 and 10 are shown on the form, this alters the concatenation of values. In the event that the conveyor belt question is marked No, those fields would not carry any value, not even 0. They’d carry a null value, which can’t be added to a number. Hence the error with that double null. How do we solve this?

When a question isn’t shown, it’s value should be zero. Pulpstream has a special function that can be used here. It’s aptly named the isNull function. isNull(Employee.Deduction,0) will check if the field does not have value. If it finds that is true, then it will send the specified default value, which is set with the number after the comma in between the parenthesis.  So in this example, if the employee deduction field value was null, the function would return a value of 0.

We need to rewrite our expression to tell the system that if those steps are not present on the form, to use 0 as their value.  

In your PPE Score Value Expression, use an expression like this instead: 

Inspection.ch6 + Inspection.ch7 + Inspection.ch8 + isNull(Inspection.ch9,0) + isNull(Inspection.ch10,0) + Inspection.ch11.

Notice how we placed the merge field value inside of the parenthesis, so the function uses it as a parameter. Notice that we are also specifying the default value after that comma. These merge tags would be different if you put spaces in between your ch and the number, or named them something else. Notice that above the Value/ Expressions field there is a “Help with Expressions” link. If you forget this function, you can always find it there along with other helpful functions.

When you are done, your expression should look like this:

update-data-fields-is-null-added

Now that we’ve edited our expression, save that step.  Save the process. Go back to Streams Management. Click on the Records tab. Click on the error.
after-is-null-records-and-error

In the subsequent popup, click the Retry button. That ought to clear that error right up!

error-cleared

That’s it.  Lock the Stream. And get ready for your next Skill Station, where we will learn how to use Smart Objects.