Limit Question Instances and Panel Nesting

When dealing with complex forms, you may wish to restrict the number of elements authors can insert, nesting depth for panels, and acceptable form structures. This example illustrates how to enforce such design constraints in Survey Creator: for example, allow just one Signature question per survey and restrict nesting of panels and matrices.

To restrict survey authors from adding more than one instance of a specific question type, handle the onAllowAddElement event.

The following code ensures that only one Signature field can be added:

const SIGNATURE_QUESTION_TYPE = "signaturepad";

function hasSignatureQuestion(surveyModel) {
  const questions = surveyModel.getAllQuestions(true, true, true);
  return questions.some(q => q.getType() === SIGNATURE_QUESTION_TYPE);
}

creator.onAllowAddElement.add((_, options) => {
  if (options.name === SIGNATURE_QUESTION_TYPE) {
    // Allow adding only if no Signature question exists
    options.allow = !hasSignatureQuestion(creator.survey);
  }
});

To maintain a clear and manageable survey structure, you can limit how deeply panels can nest and which element types can appear inside them. Use the following configuration options:

• maxPanelNestingLevel: number
  Sets the maximum depth for nested Panels and Dynamic Panels.

• forbiddenNestedElements: { panel: string[]; paneldynamic: string[]; }
  Specifies which element types cannot appear inside Panels and Dynamic Panels.

The example below applies these restrictions:

• Panels cannot contain Dynamic Panels.
• Dynamic Panels cannot contain Panels, other Dynamic Panels, Multi-Select Matrices, or Dynamic Matrices.
• Panels and Dynamic Panels are limited to two levels of nesting.

const creatorOptions = {
  maxPanelNestingLevel: 2,
  forbiddenNestedElements: {
    panel: ["paneldynamic"],
    paneldynamic: ["panel", "paneldynamic", "matrixdropdown", "matrixdynamic"]
  }
}
const creator = new SurveyCreator.SurveyCreator(creatorOptions);

// In modular applications:
import { SurveyCreatorModel } from "survey-creator-core";
const creator = new SurveyCreatorModel(creatorOptions);