SurveyJS v1.9.123
Released: December 27, 2023
SurveyJS v1.9.123 introduces APIs to access and modify an HTTP request made by choicesByUrl
in select-based questions, add a new panel after the current one in Dynamic Panel, and validate property values before assigning a JSON schema to a survey.
Select-Based Questions: Access and modify an HTTP request made by choicesByUrl
choicesByUrl
is a property that configures access to a web service in order to load choice options from it. You can find this property in select-based questions, such as Checkboxes, Radio Button Group, Dropdown, Multi-Select Dropdown, etc. A question with configured choicesByUrl
creates an XMLHttpRequest
request object internally. Previously, you couldn't access and modify this request object. In SurveyJS Form Library v1.9.123, you can do this using a new onBeforeRequestChoices
callback function. This function is part of the web
object in global settings and is called for each question with configured choicesByUrl
.
The following code uses the onBeforeRequestChoices
callback function to add authentication headers to a request:
import { settings } from "survey-core";
settings.web.onBeforeRequestChoices = (sender, options) => {
options.request.setRequestHeader('RequestVerificationToken', requestVerificationToken);
};
Dynamic Panel: Add a new panel after the current one
Dynamic Panel allows respondents to duplicate a group of form fields based on a template. Previously, respondents could only add a new group of fields to the end. The new release introduces a newPanelPosition
property. Set it to "next"
if you want respondents to add a new field group after the current one:
const surveyJson = {
"elements": [{
"name": "my-dynamic-panel",
"type": "paneldynamic",
"templateElements": [
// ...
],
"newPanelPosition": "next" // or "last"
}]
}
Validate property values before assigning a JSON schema to a survey
A SurveyModel
instance includes a fromJSON()
method, which allows you to create a survey from a JSON schema. Before applying the schema, this method validates property names and the presence of required properties. The new release enhances this method with a validatePropertyValues
flag. When this flag is enabled, the fromJSON()
method also checks that each property has an accepted value. Validation errors are collected in the jsonErrors
array.
The following code shows how to call the fromJSON()
with the validatePropertyValues
flag enabled and delete incorrect property values:
const initialJson = {
"clearInvisibleValues": "abc", // Incorrect property value
"elements": [{
"type": "text",
"name": "q1",
"textUpdateMode": "edf" // Incorrect property value
}]
};
survey.fromJSON(initialJson, { validatePropertyValues: true });
if (Array.isArray(survey.jsonErrors)) {
survey.jsonErrors.forEach(error => {
if (error.type === "incorrectvalue") {
error.element.clearPropertyValue(error.property.name);
}
});
}
const correctJson = survey.toJSON();
New Help Topics
Integrate Third-Party Vue 3 Components
Bug Fixes and Minor Enhancements
Form Library
Serializer.generateSchema()
produces an incorrect schema (#7556)- Checkboxes: "Select All" option doesn't work when using a custom item template (#7481)
- Multi-Select Dropdown (Tag Box) doesn't support line breaks in read-only mode (#7542)
- Multi-Select Dropdown (Tag Box) doesn't use default choices inside a matrix (#7558)
- Dynamic Panel asks to confirm the deletion of an empty panel or a panel with default values (#7549)
- Dropdown with
showOtherItem
enabled doesn't work correctly inside Dynamic Panel (#7559) - A required panel doesn't become focused if
checkErrorsMode
is"onComplete"
(#7562) - Optimize rendering of Single-Select Matrix (#7570)
Survey Creator