Released: October 17, 2023

SurveyJS v1.9.113 implements a delay for the auto-advance mode, conditional visibility support for carried-forward choices, a capability to specify minimum and maximum values in Multiple Textboxes questions, custom item component support in Rating Scale questions, and Copy Code and Download buttons in Survey Creator's JSON Editor tab.

Auto-advance mode allows users to switch to the next page automatically once all current page questions are answered. Previously, the page was switched instantly after a respondent gave an answer to the last question. Such an immediate switch to another page may have confused certain respondents. To improve this behavior, SurveyJS v1.9.113 introduces a 300-millisecond delay before switching to the next page. If you want to increase or decrease the delay value, use the settings.autoAdvanceDelay property:

import { settings } from "survey-core";

settings.autoAdvanceDelay = 500;

The Carry Forward Responses feature allows you to copy choice options from one question to another based on a respondent's selections. Previously, you couldn't manage the visibility of copied choices based on a condition. The new SurveyJS release adds this capability. Configure a Boolean expression that determines the visibility of a choice option and assign this expression to a question's choicesVisibleIf property. This expression will be evaluated against each choice option. To access the current choice option within the expression, use the {item} placeholder.

The following code shows how to specify the choicesVisibleIf property with a configured Carry Forward Responses feature. The "default" question includes selected choices from the "installed" question. The "secondChoice" question also includes selected choices from the "installed" question, but uses the choiceVisibleIf property to filter out the choice selected in the "default" question.

const surveyJson = {
  "elements": [{
    "name": "installed",
    "choices": ["Google Chrome", "Microsoft Edge", "Firefox", "Internet Explorer", "Safari", "Opera"],
    // ...
  }, {
    "name": "default",
    "choicesFromQuestion": "installed",
    "choicesFromQuestionMode": "selected"
    // ...
  }, {
    "name": "secondChoice",
    "choicesFromQuestion": "installed",
    "choicesFromQuestionMode": "selected",
    "choicesVisibleIf": "{item} != {default}",
    // ...
  }]
}

The new release adds minValueExpression and maxValueExpression properties that allow you to specify the minimum and maximum values for individual items in Multiple TextBoxes questions. These properties accept expressions. The following code shows a Multiple Textboxes question with two items: Start Date and End Date. The new properties help ensure that an end date falls within the range between a selected start date and the current date:

const surveyJson = {
  "elements": [{
    "type": "multipletext",
    "name": "employment-dates",
    "title": "Employment dates",
    "items": [{
      "name": "start",
      "isRequired": true,
      "inputType": "date",
      "title": "Start",
      "maxValueExpression": "today()"
    }, {
      "name": "end",
      "isRequired": true,
      "inputType": "date",
      "title": "End",
      "minValueExpression": "{employment-dates.start}",
      "maxValueExpression": "today()"
    }]
  }]
}

Rating Scale questions ask respondents to rate a particular characteristic of a product or service on a predefined scale. The scale supports different types of rate values: numbers, stars, emojis, descriptive labels. The new release adds a capability to customize rate value appearance using custom components. Implement a custom component and assign its name to the itemComponent property.

View CodeSandbox Example

The JSON Editor tab in Survey Creator now includes the Copy Code and Download buttons for users to copy the JSON schema or download it as a .json file in just one click.

The onElementDeleting event is raised before a question, panel, or page is deleted from a survey being designed. The event's options.elementType parameter allows you to find out the type of the deleted element. Previously, this parameter contained a number that designated the deleted element's type. Since Survey Creator v1.9.113, the options.elementType parameter contains the type name: "question", "panel", or "page". If you used this parameter in your code, you need to replace the numbers with the type names as follows:

Previously

creator.onElementDeleting.add((_, options) => {
  if (options.elementType === 2) {
    // Commands to execute if the element is a page
  }
  if (options.elementType === 3) {
    // Commands to execute if the element is a panel
  }
  if (options.elementType === 4) {
    // Commands to execute if the element is a question
  }
});

Currently

creator.onElementDeleting.add((_, options) => {
  if (options.elementType === "page") {
    // Commands to execute if the element is a page
  }
  if (options.elementType === "panel") {
    // Commands to execute if the element is a panel
  }
  if (options.elementType === "question") {
    // Commands to execute if the element is a question
  }
});

Localization Features in SurveyJS

Custom File Previews

Form Library

• Expression questions do not take into account the applied dark theme (#7026)
• HTML question text isn't affected by changes in the font size (#7060)
• [Vue] The None choice item is duplicated when separateSpecialChoices is enabled (#7126)
• Expression question: Title and expression result are misaligned when titleLocation is "left" (#7141)

Survey Creator

• Layout gets broken when the question type is changed (#4729)
• A theme is not applied if it is set when the Preview tab is already active (#4756)
• Theme Editor: A background image is not reset when selecting another theme (#4744)
• onOpenFileChooser is not raised from the Property Grid (#4687)
• The "Edit Choices" window doesn't clear choices when you empty the text area (#4733)
• A placeholder in the "Convert question type" list is always in English (#4747)