Skip to content

Dynamic Text and Answer Piping

Dynamic text inserts respondent answers, calculated values, and panel or row values into display strings. Use it when visible copy should reflect prior answers without calculating a new stored value.

Dynamic text is different from expression syntax:

  • Use {questionName} inside display text to pipe an answer into a title, description, choice label, HTML block, or completion message.
  • Use expression properties such as visibleIf, requiredIf, setValueExpression, calculatedValues[].expression, and expression question expression when SurveyJS needs to evaluate logic or compute a value.
  • Use stable name and choice value fields because dynamic text references those stored identifiers.

Dynamic text can appear in localizable/display properties such as:

  • Question, page, and panel title and description
  • html question content
  • Choice text, otherText, noneText, and similar labels
  • Text input placeholder
  • Root completedHtml and completedHtmlOnCondition[].html
  • Dynamic panel templateTitle, templateTabTitle, and tabTitlePlaceholder
  • Validator text, required/min/max error text, and button labels
{
"pages": [
{
"name": "contact",
"elements": [
{ "type": "text", "name": "firstName", "title": "First name", "isRequired": true },
{
"type": "html",
"name": "personalIntro",
"html": "<p>Thanks, {firstName}. The next questions are about your project.</p>",
"visibleIf": "{firstName} notempty"
},
{
"type": "text",
"name": "projectName",
"title": "{firstName}'s project name"
}
]
}
],
"completedHtml": "<h3>Thanks, {firstName}.</h3><p>We received your request for {projectName}.</p>"
}

Use dynamic text in choice text when the stored value should remain stable but the visible label should include prior answers.

{
"type": "radiogroup",
"name": "contactMethod",
"title": "How should we contact {firstName}?",
"choices": [
{ "value": "email", "text": "Email {email}" },
{ "value": "phone", "text": "Call {phone}" }
],
"visibleIf": "{email} notempty or {phone} notempty"
}

Inside dynamic panel templates, use panel-scoped placeholders when labels should refer to the current repeated item.

{
"type": "paneldynamic",
"name": "dependents",
"title": "Dependents",
"displayMode": "tab",
"templateTabTitle": "{panel.fullName}",
"tabTitlePlaceholder": "Dependent",
"templateElements": [
{ "type": "text", "name": "fullName", "title": "Full name", "isRequired": true },
{ "type": "text", "name": "birthDate", "title": "{panel.fullName}'s birth date", "inputType": "date" }
]
}
  • Prefer answer piping for visible copy and Expression Syntax for logic and calculations.
  • Keep dynamic text short in titles and button labels. Use HTML for longer interpolated instructions.
  • If a piped value may be empty, add visibleIf or provide fallback copy so the rendered text still reads naturally.
  • Dynamic text can be combined with Localizable Strings by placing the same placeholder inside each translated string.
  • Use Completion Behavior for post-submit messages that include answers or quiz score variables.