Using containers

Have more questions? Submit a request

A container is a form element used to group other form elements together, making it easier to manage and organise them. Instead of applying the same conditions (like conditional rules) to each element individually, you can apply it once at the container instead. This way, all the elements inside the container are affected at once, saving time and reducing the risk of errors. 

When you should use containers

  • When multiple form elements share the same conditional rules
  • If the same elements are repeated multiple times, a container makes it easy to duplicate a group of fields instead of creating them individually 

 

When you should avoid containers

  • If only one element is used in the container - adding it into a container adds unnecessary complexity
  • For straightforward forms without conditional logic or repetition

 


Guidelines

Do:

  • Apply shared conditions and logic to containers so you don't need to apply them multiple times at the element level
  • Label containers clearly so it's clear what the grouped fields represent
  • Test the behaviour of the container before the form is published to ensure the container is expecting the way you want it to 

Don't:

  • Apply conflicting rules at the container and element level - this may result in unexpected form behaviours

 

Add a container

  1. Navigate to Structure > Webforms > Forms and locate your webform by typing its name into the search.
  2. Open your webform and navigate to Build > + Add element.
  3. In the Select an element popup, select the Container element.
  4. Complete the Add Container element form:
    • Key: a unique identifier for the container
    • Conditions: add conditional logic that you would want to apply for all elements that will sit under this container

Add an element into the container

Drag and drop the elements into the container field so it will indent under the container element. 

Remove an element into the container

Drag and drop the elements out of the container so that it is no longer indented under the container element.

Need any more help?

If you have any questions, or require assistance with anything mentioned in this article, submit a request via the webform.

Articles in this section

Was this article helpful?
0 out of 0 found this helpful