Loop and Merge: Nested Loops
SurveyJS Form Library supports nested loops through its Loop and Merge functionality. In a nested loop setup, an outer loop iterates over a primary list of items, while an inner loop handles a related set of sub-items. For example, the form below asks an organization owner to provide information about departments (outer loop) and the employees within each department (inner loop).
To implement a nested loop, use a Dynamic Panel as the outer loop and nest either another Dynamic Panel or a Dynamic Matrix inside it. For a Dynamic Panel, define the repeated questions using the templateElements
property. For a nested Dynamic Matrix, configure the repeated fields using the columns
property.
Each loop iteration displays a title. To customize titles in a Dynamic Panel, use the templateTitle
property. For a Dynamic Matrix, use singleInputTitleTemplate
. Both properties support dynamic placeholders and text piping from other questions and loop levels.
Nested loops can be enabled only if your survey displays one input field per page. To enable this structure, set the questionsOnPageMode
property to "inputPerPage"
at the survey level.