Form Builder - Conditional Styling
The new Form Builder provides a much easier method to add conditional styling to your forms.
For an example, in this order form there is an account balance amount and past due flag which pull from another source. If the account is past due, I want the past due fields to turn red, along with the warning text.
Setting this up is very simple. In the Form Builder, highlight the element you want to work with, and click to start a new style.
It’s a good idea to name your style – this makes it easier to tell it apart from other styles you create.
Next, I’ll define the style that I want to take effect as conditions are met. I’m starting with the container which holds the “Past Due?” flag and the past due amount.
I’ve set the font to white and the background color to red, for contrast. I also added padding – this was optional, but I felt it made the message a little more visible.
Now I’ll set the conditions. This is as easy as any other tool in Ultimate Forms – a simple matter of selecting fields from pop-up menus, setting the condition (equals, does not equal, etc.), and then adding the triggering value.
NOTE: At this time, adding the value works a little differently that expected. Rather than simply typing in text of a number, a secondary dialog opens. This dialog would allow you to add values directly from SharePoint, but this is typically unnecessary at this point. Simply type in the value you desire, then click Save to proceed.
When all styles are set, click Publish in the menu bar to save and publish the form.
Back in the list, when editing an item with a larger than $500 past-du balance, I can see my styles have taken effect. For another past due item, since it has a smaller balance, the style is not triggered.