We need to be able to show company logo at the top of the survey

Introduce:

• logo property
• width/height property
• position property: left/right/top/bottom from the survey title and description

Let's say you want to allow your end-users to select a country. The current solution is to modify a "dropdown" question with some preset and put it into toolbox. The current code is the following:

creator
    .toolbox
    .addItem({
        name: "countries",
        isCopied: true,
        iconName: "icon-default",
        title: "All countries",
        json: {
            "type": "dropdown",
            optionsCaption: "Select a country...",
            choicesByUrl: {
                url: "https://restcountries.eu/rest/v2/all"
            }
        }
    })

The code is taken from toolbox customization example. What if you need more and what to add some code behind this definition. And how to hide all unneeded properties, like choices, choicesByUrl and many others, from this question, that is actually still a dropdown question.

We want you to inroduce a way, where you can easily create a new question type: "country" and end-user will operate with this question even in JSON as: { type: "country", name: "myCountry"}. It should be in Toolbox, end-user can't modify or access properties that he doesn't need for a country question. You do not need to write a specific code for a survey to handle it's events when needed. It becomes a component model.

Code examples

Coming

See also composite custom question (where you can setup several questions at once) functionality.

Let's say your users often create a survey that contains information about their/your clients. It may include first/last names, address, phones, birthdate and so on. Commonly, end-user have to drop several questions, setup them and layout them on the page or panel. End-user can copy these questions from one survey to another. However, as soon as he copies these questions into another survey, he would have to support several versions of client information. If he decides to add/remove/change a question (for example phone), then it would require to change it in several surveys. Additionally, it is not an easy task for a non-technical person.

Composite question will solve this problem. It will allow to create, for our example, question type: "customerinformation" with all setup questions located in one panel. The value in the survey will be stored as: questionName: {firstName: ClientFirstName, lastName: CliertLastName, ...}. End-user could not access to internal questions. He could not customize them. You will be able to write the code and add properties to customize the question on high level: hide/show different questions, for example show/hide birthdate or address question(s).

Code examples

Coming

See also custom question (where only one question is available) functionality.

Scenario: There is a need of combination of matrix (single choice) and matrices (multiple choices and dynamic). Instead of having a radiogroup or checkbox column, show several columns, where every button (radio or check) will be in a separate column. The related issue on SurveyJS Support Desk.

We introduced a showInMultipleColumns boolean property, it is false by default. For cellType equals to "checkbox" and "radiogroup", you can set it to true to show all visible choices into separate columns/cells.

Let's see the following json question:

{
  type: "matrixdropdown",
  name: "question1",
  columns: [
    {
      name: "col1",
      cellType: "dropdown",
      showInMultipleColumns: true,
      isRequired: true,
      choices: [
        "Strongly disagree",
        "Disagree",
        "Neutral",
        "Agree",
        "Strongly agree"
      ]
    },
    {
      name: "comment",
      title: "Please comment",
      cellType: "comment"
    }
  ],
  rows: [
    "Excited",
    "Enthusiastic",
    "Open",
    "Physically safe",
    "Emotionally safe",
    "Apprehensive",
    "Nervous",
    "Scared"
  ]
}

When you set showInMultipleColumns to true for the first column then column title is ignored and we get the following layout

As you see, we are getting cleaner UI.

Until this moment SignaturePad question is available as the custom widget. It's a widely used question type and we decided to implement it in the SurveyJS Library.

We have sum and avg functions, but we don't have min and max function. Here is the example of expression: "min({question1}, {question2}, 0)" or "max({question1}, 10)".

Are you requesting a feature, reporting a bug or asking a question?

Feature

What is the current behavior?

Currently we can select the html input type, but not set additional attributes. Attributes that only apply to the text input type however are always configurable, even when not relevant. For text we have maxlength, minlength and pattern amongst others. For date attributes that apply (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date#Additional_attributes) are: max, min and step.

What is the expected behavior?

There should be some way to specify these attributes (without coding for every possible combination).

Proposed solution 1

Add a key value property that allows us to specify custom input attributes for this question type.

Proposed solution 2

Create a custom question type for each html input type. This is the best solution, but also requires a lot more work.

Are you requesting a feature, reporting a bug or asking a question?

bug report

What is the current behavior?

The following warning appears in the console in a react application:

Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of SurveyQuestion.

What is the expected behavior?

No warning, as key prop is provided for child elements.

How would you reproduce the current behavior (if this is a bug)?

I'm getting the warning with the matrix question.

Provide the test code and the tested page URL (if applicable)

See the console at the example: https://surveyjs.io/Examples/Library?id=questiontype-matrix&platform=Reactjs&theme=modern

Specify your

• browser: Chrome
• browser version: Version 80.0.3987.149 (Official Build) (64-bit)
• surveyjs platform (angular or react or jquery or knockout or vue): react
• surveyjs version: 1.5.17, 1.5.18

Hello!

To begin with, I would like to thank you for creating an excellent library!

So it’s my turn to add tags to the question.
The most suitable in my situation, I consider the "set" property editor.

But I have two questions:

1. How can I get choises from the backend?
   Unfortunately choicesCallback parameter is null instead of function in choises function callback. It also doesn't support promises as I understand. So can you propose some other way?

2. My backend return objects because I need to support localizations, but as I can see it supports only string values? Any suggestions?

If matrix dropdown has non empty valueName property, then Condition Editor stops working.

Condition Editor could not parse and build visual editor for expression when calculated values are using.

The initial bug was posted into our support desk.

Allow to modify an action type for an action item. End-user could change question visiblity on quesiton enable/disable action type, for example. On creating a new logic item, create a new action by default with non-set action type. UI becomes better, there is no concepts of new action section. New action section was removed.

1. Open Internet Explorer
2. Go to https://surveyjs.io/create-survey
3. ???
4. Drop questions here image has wrong size

See the https://surveyjs.answerdesk.io/ticket/details/t3730/change-drop-down-option-value-in-creator-advance-properties-the-change-is-not-reflected thread for more details

Version: 1.5.13 Plunkr: https://plnkr.co/edit/pMMil9MHjY2eoeIXodHB?p=preview (open console and click Complete)

Error:

Uncaught TypeError: Cannot read property 'appendChild' of null
    at VisualizationPanel.render (visualizationPanel.ts:240)
    at VisualizationMatrixDynamic.VisualizationPanelDynamic.render (visualizationPanelDynamic.ts:33)
    at VisualizationPanel.renderVisualizer (visualizationPanel.ts:209)
    at visualizationPanel.ts:227
    at Array.forEach (<anonymous>)
    at VisualizationPanel.render (visualizationPanel.ts:226)
    at Array.<anonymous> (index.js:63)
    at Event.fire (base.ts:1065)
    at SurveyModel.doComplete (survey.ts:2694)
    at SurveyModel.doCurrentPageCompleteCore (survey.ts:2493)

With this commit https://github.com/surveyjs/survey-analytics/commit/f53302a6a65ddd55d427ccdc5597931e82e80efb DataTables.Settings is used, but no such type exists. Therefor upon building, this leads to: ERROR in node_modules/survey-analytics/survey.analytics.d.ts:234:33 - error TS2702: 'DataTables' only refers to a type, but is being used as a namespace here.

The following code is rather complex. question.addError(new Survey.CustomError("my error text)); If a developer wants to show just an error with his text, the most common case. then the API should be question.addError(my error text);, as result the typescript API: public addError(error: SurveyError | string).

Because of style .sv-question__required-text requried text renders in incorrect location in question title.

Add an event that will allow to scroll/show element inside the survey on page using external code instead the default code. It requires in case of there is a header with a fixed height on the page.

  /**
   * Use this event to control scrolling element to top. You can cancel the default behavior by setting options.cancel property to true.
   * <br/> `sender` - the survey object that fires the event.
   * <br/> `options.element` - an element that is going to be scrolled on top.
   * <br/> `options.question` - a question that is going to be scrolled on top. It can be null if options.page is not null.
   * <br/> `options.page` - a page that is going to be scrolled on top. It can be null if options.question is not null.
   * <br/> `options.elementId` - the unique element DOM Id.
   * <br/> `options.cancel` - set this property to true to cancel the default scrolling.
   */
  public onScrollingElementToTop: Event<
    (sender: SurveyModel, options: any) => any,
    any
  > = new Event<(sender: SurveyModel, options: any) => any, any>();

Are you requesting a feature, reporting a bug or asking a question?

A logic bug, or maybe I'm missing something

What is the current behavior?

I'm trying to build a one-question-per page questionnaire with 6-7 questions in total. To reuse an example of a solved issue, lets assume this scenario:

Question 1 is "Do you have a car?" with a boolean question yes/no. I want the form to continue to the next question via the setting "On answering all questions, go to the next page automatically". If people say no/false, there should be a follow-up boolean with "Do you want to buy one?" (on a new page or directly afterwards, doesn't matter where) which follows the logic "enable and visible if {car} = false". So far so good, but no matter where I click on the boolean item, its behaviour always goes to true first before I can switch it to false. In this scenario, you can only answer yes and proceed to the next question immediately without being able to answer no and get to see the other question, does that make sense?

What is the expected behavior?

If I click on the left side of the boolean button, it should go to the left/false and if I click on the right side, it should go to right/true.

How would you reproduce the current behavior (if this is a bug)?

As stated above.

Specify your

• browser: Firefox/Chrome
• browser version: Latest

When using a question of type matrixdropdown, the strings defined for the total of the column through totalFormat are shown in default locale only.

Are you requesting a feature, reporting a bug or asking a question?

Reporting bug

What is the current behavior?

When changing the language, totalFormat is not translated and is always set to the default language

What is the expected behavior?

When changing the language, totalFormat should be set to the string defined by the chosen language

How would you reproduce the current behavior (if this is a bug)?

Use the JSON definition below and test it with surveyJS v1.5.17, try to switch bewteen english, french and german and observe how the string of the total of the columns are not translated.

Provide the test code and the tested page URL (if applicable)

Here is a miniaml working example

{
 "title": {
  "default": "Test survey",
  "fr": "Questionnaire de test",
  "de": "Testumfrage"
 },
 "pages": [
  {
   "name": "events",
   "elements": [
    {
     "type": "matrixdropdown",
     "name": "matrix_test",
     "title": {
      "default": "test Matrix",
      "fr": "Matrice de test",
      "de": "Testmatrize"
     },
     "isRequired": true,
     "columns": [
      {
       "name": "col1",
       "title": {
        "default": "Column 1",
        "fr": "Colonne 1",
        "de": "Spalt 1"
       },
       "cellType": "text",
       "isRequired": true,
       "validators": [
        {
         "type": "numeric",
         "minValue": 0,
         "maxValue": 300
        }
       ],
       "totalType": "sum",
       "totalFormat": {
        "default": "Total column 1: {0}",
        "de": "Total Spalt 1: {0}",
        "fr": "Total colonne 1: {0}"
       },
       "totalDisplayStyle": "decimal",
       "inputType": "number"
      },
      {
       "name": "col2",
       "title": {
        "default": "Column 2",
        "fr": "Colonne 2",
        "de": "Spalt 2"
       },
       "cellType": "text",
       "isRequired": true,
       "totalType": "sum",
       "totalFormat": {
        "default": "Total column 2: {0}",
        "fr": "Total colonne 2: {0}",
        "de": "Total Spalt 2: {0}"
       },
       "totalDisplayStyle": "decimal",
       "inputType": "number"
      },
      {
       "name": "col3",
       "title": {
        "default": "Column 3",
        "fr": "Colonne 3",
        "de": "Spalt 3"
       },
       "cellType": "text",
       "isRequired": true,
       "validators": [
        {
         "type": "numeric",
         "minValue": 0,
         "maxValue": 300
        }
       ],
       "totalType": "sum",
       "totalFormat": {
        "default": "Total column 3: {0}",
        "fr": "Total colonne 4: {0}",
        "de": "Total Spalt 3: {0}"
       },
       "totalDisplayStyle": "decimal",
       "inputType": "number"
      }
     ],
     "rows": [
      {
       "value": "one",
       "text": {
        "default": "One",
        "fr": " Un",
        "de": " Ein"
       }
      },
      {
       "value": "two",
       "text": {
        "default": "Two",
        "fr": "Deux",
        "de": "Zwei"
       }
      },
      {
       "value": "three",
       "text": {
        "default": "Three",
        "fr": "Trois",
        "de": "Drei"
       }
      }
     ]
    }
   ],
   "title": {
    "default": "Events",
    "fr": "Evénements",
    "de": "Veranstaltungen"
   }
  }
 ]
}

Specify your

• browser: Firefox
• browser version: 74.0
• surveyjs platform (angular or react or jquery or knockout or vue): using https://surveyjs.io
• surveyjs version: v1.5.17

The following code doesn't work correctly. question is null, but it should not. questionByName function should convert to lowercase question name if caseInsensitive parameter is true.

  var survey = new SurveyModel({
    elements: [
      {
        type: "text",
        name: "Q1"
      }
    ]
  });
var question = survey.getQuestionByName("Q1", true);
//question should not be null

The issue

The following code, where matrix is QuestionMatrixDropdown doesn't re-render the table matrix.rows.push(new ItemValue("row2")); or matrix.rows.splice(0, 1)

The expected bevahior

It should re-render the table and add or remove a row.

Here is the scenario. The property defaultValueFromLastRow for matrix dynamic is set to true. Values from new added rows are copied from the preview row. However, there is a need to clear a value in a column. Here is the working example. The code in event is the following:

survey.onMatrixRowAdded.add(function(sender, options) {
    var rows = options.question.visibleRows;
    var addedRow = rows[rows.length - 1];
    addedRow.getQuestionByColumnName('subject').clearValue();
});

When it should be:

survey.onMatrixRowAdded.add(function(sender, options) {
    options.row.getQuestionByColumnName('subject').clearValue();
});

Until this moment in the "default" theme file question browser rendered native input "file" button. This didn't allow to localize the button caption.

See the https://surveyjs.answerdesk.io/ticket/details/t3677/localization-issue-for-file-control-in-file-type-question thread for more details.

We can improve it if use the markup from the modern theme.

See the https://surveyjs.answerdesk.io/ticket/details/t3688/accessibility-issue-aria-label-missing thread for more details.

SurveJS Creator used question.addConditionNames, but for many releases it uses question.addConditionObjectsByContext and question.addConditionNames is not needed and can be removed.

addConditionObjectsByContext should use question.getValueName() instead of question.name. SurveyJS Creator use this function in Condition Property Editor.

1. Go to https://surveyjs.io/create-survey/
2. Add matrix dynamic question
3. Change cell type
4. ???
5. Default value editor in Data tab not changes the type (also default value editor hasn't full width)

1. Go to https://surveyjs.io/create-survey
2. Add rating question
3. Check hasComment proerty
4. ???
5. Property has old design

GotoName selector (dropdown) is empty on editing logic item in logic tab.

Add an option to hide dropdown page selector Move the "Add new page" button closer to pages Implement dynamic scrolling

In order to hide dropdown page selector one need to set the following option:

  var options = {
    showDropdownPageSelector: false
  };
  var creator = new SurveyCreator.SurveyCreator("creatorElement", options);

The current UI confused end-user. They have to add an action first and then go upper and setup it. The better UI is to set the action first and then add it.

Default Value and Correct Value properties shows the survey inside, that can be out of date because end-user changed properties like choices, columns and rows. "Refresh" button allows to update the survey for choosing value to get the latest changes made by end-user.

Setup property editors on demands, when end-user opens/expand the tab.

Right now we do not update expressions on changing question.valueName property and update them on question.name property changing only. It is wrong. We have to:

1. Ignor changing question.name if question.valueName property is not empty
2. On changing valueName from empty to a value, rename expressions by replacing question.name with question.valueName
3. On changing valueName from one value to another, update expressions by replacing question.valueName from old value to new value.
4. On clearing valueName update expressions by replacing old value of question.valueName with question.name

We did not allow to change the rateValues property for rating column.

This is the second rewriting the way we are rendering question title and we hope it is the last one. Initially we were rendering question title using the template, survey.questionTitleTemplate. By default, it was: “. ”. So, the question title renders as: “1. What is your name?*”

It works perfectly. End-users can change the template in any way they want, for example to: “) ”, and result becomes: “1) * What is your Name?”.

Unfortunately, this approach does not allow to give different styles for numbering and require text. There are many requests of this. For example, to render a cycle around the number or render the required (*) text in red color. There was a work-around to do it, by using mark-down, but it was an overcomplicated solution.

As result we decided to start render question number, title and require texts separately. Additionally two news styles were introduced: . sv-question__num and . sv-question__required-text. Developer needs to override these styles to change question number and require text look. It works perfectly, unless the survey.questionTitleTemplate is not changed. If it is changed, then we are rendering them as one string. It needs when somebody needs require text in another position or want to have another symbol, instead of dot, in numbering, for example “(1)” or “# 1”, instead of “1.”.

New property We review many requests and come to conclusion that we can replace survey.questionTitleTemplate with a simple choice property. We introduced a new property survey.questionTitlePattern. There are four choices: numTitleRequire, “1. What is your name? ”, it is a default value numRequireTitle, “1. * What is your name?” requireNumTitle, “ 1. What is your name?” numTitle, “1. What is your name?”, do not show require text at all. You can change the title style to point end-users that the question is required.

Important survey.questionTitleTemplate becomes obsolete. It is loaded into survey model, but doesn’t serialized back. Survey Model on setting the property will try to convert the template into according questionTitlePattern proeprty. For example “ ) ” will change survey.questionTitlePattern into “requireNumTitle” value. Additionally, survey.questionStartIndex becomes “1)”.

Prefix and postfix for numbering Another change, survey.questionStartIndex has a prefix and postfix now. The default value is “1.”, where "1" tells that you want to start your question numbering from 1 and postfix is “.”. You can set it to “# 1)” or “(a)”. It is the alternative to questionTitleTemplate where you were able to have a prefix and postfix for numbering. We hope it solves all know issues and allows to introduce you what you require with minimum/zero coding.

At this moment comment and other value text are missing in the the survey result plain data.

Question JSON:

      {
        type: "checkbox",
        name: "q1",
        hasOther: true,
        choices: [ "lion", "giraffe", "panda", "camel" ]
      }

Plain data with other and giraffe selected:

{
    "name": "q1",
    "title": "q1",
    "value": [
        "other",
        "giraffe"
    ],
    "displayValue": "Other value text, giraffe",
    "isNode": true,
    "data": [
        {
            "name": 0,
            "title": "Choice",
            "value": "other",
            "displayValue": "Other value text",
            "isNode": false,
            "isOther": true
        },
        {
            "name": 1,
            "title": "Choice",
            "value": "giraffe",
            "displayValue": "giraffe",
            "isNode": false
        }
    ]
}

Question JSON:

      {
        type: "checkbox",
        name: "q1",
        hasComment: true,
        choices: [ "lion", "giraffe", "panda", "camel" ]
      }

Plain data with comment entered and giraffe selected:

{
    "name": "q1",
    "title": "q1",
    "value": [
        "giraffe"
    ],
    "displayValue": "giraffe",
    "isNode": true,
    "data": [
        {
            "name": 0,
            "isComment": true,
            "title": "Comment",
            "value": "-Comment",
            "displayValue": "Comment text",
            "isNode": false
        },
        {
            "name": 0,
            "title": "Choice",
            "value": "giraffe",
            "displayValue": "giraffe",
            "isNode": false
        }
    ]
}

Question JSON:

      {
        type: "radiogroup",
        name: "q1",
        hasOther: true,
        choices: [ "lion", "giraffe", "panda", "camel" ]
      }

Plain data with other selected:

{
    "name": "q1",
    "title": "q1",
    "value": [
        "other"
    ],
    "displayValue": "Other value text",
    "isNode": true,
    "data": [
        {
            "name": 0,
            "title": "Choice",
            "value": "other",
            "displayValue": "Other value text",
            "isNode": false,
            "isOther": true
        }
    ]
}

Question JSON:

      {
        type: "radiogroup",
        name: "q1",
        hasComment: true,
        choices: [ "lion", "giraffe", "panda", "camel" ]
      }

Plain data with giraffe selected and comment entered:

{
    "name": "q1",
    "title": "q1",
    "value": [
        "giraffe"
    ],
    "displayValue": "giraffe",
    "isNode": true,
    "data": [
        {
            "name": 0,
            "isComment": true,
            "title": "Comment",
            "value": "-Comment",
            "displayValue": "Comment text",
            "isNode": false
        },
        {
            "name": 0,
            "title": "Choice",
            "value": "giraffe",
            "displayValue": "giraffe",
            "isNode": false
        }
    ]
}

We need to have an ability to add static images of different size to surveys. We need to implement an image question that allows to show given image, like below:

It should support the following attributes:

• image link
• image width
• image height

We need the option to hide this button:

  /**
   * The event is called before rendering a delete button in the Property Grid or in Question Editor.
   * <br/> sender the survey creator object that fires the event
   * <br/> options.obj the survey Question
   * <br/> options.item the object property (Survey.JsonObjectProperty object). It has name, className, type, visible, readOnly and other properties
   * <br/> options.canDelete a boolean value. It is true by default. Set it false to remove delete button from the Property Grid or in Question Editor
   */
  public onCanDeleteItem: Survey.Event<
    (sender: SurveyCreator, options: any) => any,
    any
  > = new Survey.Event<(sender: SurveyCreator, options: any) => any, any>();

This is a bad practice to address HTML elements in the re-usable library via IDs. This can cause issues of different kind - from accessibility to bugs.

See the https://surveyjs.answerdesk.io/ticket/details/t3645/accessibility-issue-for-duplicate-id thread for more details.

This event can be used to override the end-user notifications: instead of the default alert() function the option.message can be show via custom notification library

  /**
   * The event is called in case of UI notifications. By default all notifications are done via built-in alert () function.
   * In case of any subscriptions to this event all notifications will be redirected into the event handler.
   * <br/> options.message is a message to show.
   */
  public onNotify: Survey.Event<
    (sender: SurveyCreator, options: any) => any,
    any
  > = new Survey.Event<(sender: SurveyCreator, options: any) => any, any>();

When survey.textUpdateMode equals to "onBlue", default value, the comment question in react raise survey.onValueChanged event on typing a letter. It behaves always as survey.textUpdateMode equals to "onTyping".

Comment question should raise survey.onValueChanged event on loosing its focus when survey.textUpdateMode equals to "onBlue".

Right now to set a event to a DOM element requires to handle several events and write a different code, in case if you want to change the rendering, for example, for text input in Text Question, Multiple Text Question and in matrices (dropdown and dynamic). By introducing survey.onAfterRenderQuestionInput will allow to update DOM element for questions that uses as stanalone questions (text, dropdown and so on) and in composite questions: multiple text and matrices. Here is the example of suspending to type 'e' letter for number input.

survey.onAfterRenderQuestionInput.add(function(sender, options) {
  if (options.question.getType() === "text") {
    if (options.question.inputType === "number") {
      options.htmlElement.addEventListener("keypress", function(evt) {
        if (
          (evt.which != 8 &&
            evt.which != 0 &&
            evt.which != 46 &&
            evt.which < 48) ||
          evt.which > 57
        ) {
          evt.preventDefault();
        }
      });
    }
  }
});

Here is the survey JSON. It will apply for all input elements in this survey.

var json = {
  elements: [
    {
      type: "text",
      name: "q1",
      inputType: "number"
    },
    {
      type: "multipletext",
      name: "q2",
      items: [
        { name: "item1", inputType: "number" },
        { name: "item2", inputType: "number" }
      ]
    },
    {
      type: "matrixdynamic",
      name: "q3",
      rowCount: 2,
      columns: [
        {
          name: "col1",
          cellType: "text",
          inputType: "number"
        }
      ]
    }
  ]
};

I'm reporting a bug

What is the current behavior?

At the default value, Boolean does not update to Yes unless I double click on it. This occurs in IE and Edge only. It works fine in Chrome and Firefox.

What is the expected behavior?

The switch should change to Yes after a click.

Provide the test code and the tested page URL (if applicable)

Tested page URL: https://surveyjs.io/Examples/Library/?id=questiontype-boolean&platform=Reactjs&theme=default#content-result

Specify your

• browser: IE, Edge
• browser version: IE 11.719.18362.0, Edge 44.18362.449.0
• surveyjs platform: react
• surveyjs version: 1.1.31

Can't move a question from panel to empty space under panel if panel is the only element on-page.

SurveyPDF now support rendering matrix columns with custom column width like in SurveyJS Library via this and this commits

Also removed excess space for left padding in expression question and fixed incorrect top padding for value in textbox-like questions

  /**
   * The event is fired after survey is loaded from api.surveyjs.io service.
   * You can use this event to perform manipulation with the survey model after it was loaded from the web service.
   * <br/> `sender` - the survey object that fires the event.
   * @see surveyId
   * @see loadSurveyFromService
   */
  public onLoadedSurveyFromService: Event<
    (sender: SurveyModel, options: any) => any,
    any
  > = new Event<(sender: SurveyModel, options: any) => any, any>();

Example of using:

survey.onLoadedSurveyFromService.add(function(sender, options){
 //It is save now to perform some changes to the model
  survey.data = myData;
});

Modern theme should support theme customization similar the sample - https://surveyjs.io/Examples/Library?id=custom-theme&platform=jQuery&theme=modern

See the https://surveyjs.answerdesk.io/ticket/details/t3565/overriding-modern-theme-css thread for more details

If you set

Survey.Serializer.findProperty("page", "title").isRequired = true;

property grid shows the error on the empty text but adorner allows to set an empty text.

The behavior should be consistent.

If the expression has only one condition then it is hard to clear the expression. We have to show the remove button even if there is only one condition in the expression.

The following code will add two properties into itemvalue and they will appear in the table for editing choices:

Survey.Serializer.addProperty("itemvalue", { name: "myImageLink" });
Survey.Serializer.addProperty("itemvalue", { name: "tag:number" });

It will be nice to have the column header text as: "My Image Link" and "Tag", without setting the localization text.

If visibleIf property has the following value: visibleIf: "{question1} = ['item1', 'item3']", then Condition Property Editor fails to show it in visual builder and allow to edit the expression in text editor. It is not correct, we have to show checkbox with preset values.

I have a problem with text field updating. I found this issue while tesing zip code field.

Reporting a bug

How would you reproduce the current behavior (if this is a bug)?

To reproduce bug need to enter numeric string with leading zeros f.e. "0077" and store survey data (go to next page).

Then if we return to previous page and change input value to "77" or "077" and try to update survey result no changes will be stored.

What is the current behavior?

If we return we'll see "0077" in this input.

What is the expected behavior?

Value must be changed

Possible reason

I think the problem is in unstrict comparing in change detection. "0077" == 77 but "0077" !== 77. If number from string value changing everything works as expected.

Please check it.

Best regards, Boris

Specify your

• browser: Chrome
• browser version: Version 80.0.3987.106 (Official Build) (64-bit)
• surveyjs platform (angular or react or jquery or knockout or vue): React
• surveyjs version: 1.5.9

Are you requesting a feature, reporting a bug or asking a question?

bug

What is the current behavior?

survey does not get populated with preloaded data in dropdown question with restful options. It seems that the last working version was 1.5.3

What is the expected behavior?

work as it used to till 1.5.3

How would you reproduce the current behavior (if this is a bug)?

https://plnkr.co/edit/TvZ5VtJh6nYIo7yaNoOf?p=preview

columns visibility is not changed in knockout version. There is an issue with binding.

Check console log in https://surveyjs.io/Examples/Library?id=questiontype-imagepicker&platform=jQuery&theme=modern

Are you requesting a feature, reporting a bug or asking a question?

Bug

What is the current behavior?

What is the expected behavior?

SurveyJS should know that selecting other means we're not done yet; now the user is greeted with a big error that is very unexpected.

How would you reproduce the current behavior (if this is a bug)?

Enable automatically go to next page behavior create a question that has an other option.

Specify your

• surveyjs platform (angular or react or jquery or knockout or vue): knockout
• surveyjs version: *.12

Image Picker with multiSelect kills performance especially in Survey Creator.

Currently, if you add a localizable custom property into itemvalue class, you would not see it in localization tab:

Survey.Serializer.addProperty("itemvalue", {
  name: "description",
  isLocalizable: true
});

It should be in localization tab, after itemvalue text property.

End-user can set incorrect value into property editor and as result, he will see the error and the entered value will not set into the object property value. End-user can correct it or in some case a developer can correct the value from the code. In case when a developer correct a value from the code, we have to clean the error message, since it is no longer makes sense to show error, because the value is already changed in the object.

The library, treats minValue equals to 0 as empty. The editor for the following property definition doesn't work correctly.

Survey.Serializer.addProperty('question', {
  name: 'decimalPlaces:number',
  default: 0,
  minValue: 0,
  maxValue: 5,
  category: 'validation',
  visibleIndex: 0,
});

End-user can set -5 into decimalPlaces property, which is incorrect.

See https://next.plnkr.co/edit/8Mq83uCgdZbRFrSM plunker for more details:

• append matrix dynamic
• change column type to signaturepad
• press edit

Got:

Are you requesting a feature, reporting a bug or ask a question?

A bug

What is the current behavior?

Cell type changes are not reflected in design surface immediately on change in property grid

What is the expected behavior?

Cell type changes should be reflected in design surface immediately on change in property grid

How would you reproduce the current behavior (if this is a bug)?

• drop matrix dropdown question
• open property grid
• open columns group
• change cell type from the Default to the radiogroup
• column still rendered as default dropdown

Provide the test code and the tested page URL (if applicable)

Tested page URL: https://surveyjs.io/Examples/Survey-Creator?id=editor-custom-theme&theme=bootstrap

We are creating UI for building condition expression even if it is hidden. We have to build it only when it is showing and rebuild it on hiding/showing.

When choosing checkbox or radiogroup as selected question in condition editor, it shows all items in one line with horizontal scrollbar for bootstrap theme.

We need an option to disable built-in layout engine. It should be possible via the allowDynamicLayout option

var visPanel = new SurveyAnalytics.VisualizationPanel(
  document.getElementById("summaryContainer"),
  survey.getAllQuestions(),
  normalizedData,
  { allowDynamicLayout: false }
);

See the https://surveyjs.answerdesk.io/ticket/details/t3545/draggable-visualizers-columns thread for more details

The following code will produce exception in Survey Creator:

    Serializer.addProperty("itemvalue", {
      name: "description:text",
      isLocalizable: true
    });

The reason, property.getPropertyValue(obj) function will produce the null reference error.

Are you requesting a feature, reporting a bug or ask a question?

Bug

What is the current behavior?

Drag & drop is broken in v1.5.11, you can't reorder questions

How would you reproduce the current behavior (if this is a bug)?

• Go here: https://surveyjs.io/create-survey
• Try to swap 2 questions via DnD

Provide the test code and the tested page URL (if applicable)

Tested page URL: https://surveyjs.io/create-survey

Specify your

• browser: Chrome latest
• editor version: v1.5.11

Are you requesting a feature, reporting a bug or asking a question?

There is some problem I suppose, perhaps a bug or another way to use functionality.

What is the current behavior?

When I get json from back-end survey doesn't re-render and show nothing. Just empty survey form with typical span.

What is the expected behavior?

I want to request json from db and then implement it into survey model. This way works with 1.1.8 version but doesn't work with >1.1.24 (or another, I'm sure only about 1.1.8 version). Could you explain please, is it a bug or there is another way to do it?

Provide the test code and the tested page URL (if applicable)

Test code

const App: React.FC = () => {

    const [model, setModel] = useState<SurveyModel>(new (Survey as any).Model());

    useEffect(() => {
        axios.get('someURL')
            .then((response) => {
                setModel(new (Survey as any).Model(JSON.stringify(response.data)));
                console.log(response.data);
            })
    }, []);

    return (
        <div className="App">
            <Survey.Survey
                model={model}
                onComplete={(sender: SurveyModel) => console.log('complete survey form')}
            />
        </div>
    );
};

Specify your

Mozila firefox 60.9.0esr React application react-survey versions: 1.1.8 and 1.1.24

Are you asking a question?

Is it possible to turn off/remove placeholders in display mode?

What is the current behavior?

I have some placeholders in optional fields. When nothing is filled in, they look like they have input because of the placeholders when you're looking at the survey in display mode.

What is the expected behavior?

I would like an option to have the placeholders (any placeholder) removed/invisible in display mode of know how to do it if it already exists. Thanks a lot!

Specify your

• browser: Chrome/Firefox
• browser version: latest
• surveyjs platform (angular or react or jquery or knockout or vue): jQuery
• surveyjs version: 1.5.9

Here is the JSON:

{
  "pages": [{
    "name": "page1",
    "elements": [{
      "type": "radiogroup",
      "name": "question1",
      "title": "What do you want to do?",
      "choices": [{
        "value": "item1",
        "text": "Goto Page 3"
      }, {
        "value": "item2",
        "text": "Goto Page 2 (Hide Page 1)"
      }]
    }],
    "visibleIf": "{question1} <> 'item2'"
  }, {
    "name": "page2",
    "elements": [{
      "type": "html",
      "name": "question2",
      "html": "Page 2"
    }],
    "visibleIf": "{question1} = 'item2'"
  }, {
    "name": "page3",
    "elements": [{
      "type": "html",
      "name": "question3",
      "html": "Page 3"
    }]
  }]
}

On setting question1 to 'item2', we should hide the first page, show the second page and make it current. However, library at first hides the first page, make the third page current and makes second page visible, but the current page is already the the third page. We should check, if there is/are page(s) that becomes visible on changing the value and that are between the first and third pages.

Considering you have a defaultValue for checkbox as ["item1", "item2", "item3"], however, two choices "item1" and "item2" are invisible by default and depends on other questions values. If they are invisible by default, then the checkbox question value becomes ["item3"], even if a user by answering on other questions makes "item1" and "item2" visible, he will see the predefined checkbox values as ["item3"] instead of ["item1", "item2", "item3"]. Solution: if a checkbox question value doesn't change then on making visible checkbox choices, restore their values as well.

Are you requesting a feature, reporting a bug or asking a question?

Bug

What is the current behavior?

The language code used for Czech is cz, but according to ISO63901 it should be cs.

What is the expected behavior?

Localization should use language codes not country codes.

End-users have hard time to understand how to edit visibleIf, enableIf and other expression/condition properties. We need to make text editor invisible by default, show it in separate tab and show all conditions in grid view:

We need to show text editor, only for advanced users or if we could not parse expression and show it in the table view.

Make Logic Tab UI clean and more understandable for end-users

It is currently impossible to set creator.selectedElement to null. It would select the survey and as result show survey properties in the property. By allowing to set the null value to creator.selectedElement, it will become possible do not show survey/page properties in the property grid. Here is the example that disable selecting survey and page:

      creator.onSelectedElementChanging.add(function(c, options) {
        var el = options.newSelectedElement;
        if (
          el != null &&
          (el.getType() == "page" || el.getType() == "survey")
        ) {
          options.newSelectedElement =
            creator.survey.getAllQuestions().length > 0
              ? creator.survey.getAllQuestions()[0]
              : null;
        }
      });

      //creator.JSON = YourSurveyJSON;
      creator.selectedElement = null;

There is fatal error on modify any survey attribute but only in "modal mode". I prefer modal than tab so it's critical for me.

Cannot set property pages of #<SurveyModel> which has only a getter

Instruction:

1. Go to: https://surveyjs.io/Examples/Survey-Creator/?id=options&theme=bootstrap
2. Change mode to "Show toolbox in right container and hide property grid".
3. Open settings modal.
4. Change any survey attribute and click "Apply".

• browser: any.
• editor version: 1.5.10

Are you requesting a feature, reporting a bug or ask a question?

Bug.

What is the current behavior?

readOnly for question has no effect

What is the expected behavior?

Make input disabled / not editable.

How would you reproduce the current behavior (if this is a bug)?

Survey.Serializer.addProperty('question', {
    maxLength: 15, // it works
    readOnly: true, // it doesn't
    name: 'sourceTitle',
    category: 'general'
});

v: 1.5.10

When editing column in matrix dynamic question and try to change matrixcolum.visibleIf expression, then on setting in expression "row.columnName" the editor do not allow to edit value for this expression: "row.columnName" equal [no editor for eding the value].

To add condition for radiogroup question we are showing radiogroup right now. However, absolutely same functionaliy has dropdown question and it is compact, comparing to radiogroup. It is better to use dropdown instead of radiogroup.

Options: creator.showToolbox = false; creator.showPropertyGrid = "left";

Lead to:

Currently it is hard to find out, if end-user press "Next"/"Prev" button in onCurrentPageChanged and onCurrentPageChanging events. Add two new options into these events:

* `option.isNextPage` - commonly means, that end-user press the next page button. In general, it means that options.newCurrentPage is the next page after options.oldCurrentPage
* `option.isPrevPage` - commonly means, that end-user press the previous page button. In general, it means that options.newCurrentPage is the previous page before options.oldCurrentPage

On editing choices, if text colum is hidden and we allow only value property to edit, then there is no need for rendering "Value". It takes place and only confuse end-users.

Add check if header not empty via this commit in matrix render

Implemented setting image width and size in file question via this commit

I have a multi-page survey that has a few required fields but it's not showing on the latest version of survey-jquery (^1.5.5)

isRequired: true is set on the first name based on the screenshot below:

But when viewed via Test Survey it does not show the required text:

Is there anything that needs to be updated on the JSON file so that it properly reflects the required text? or is this a bug on the latest version?

Any help would be appreciated. Thanks!

The followning json doesn't work correctly:

{
      elements: [
        {
          type: "paneldynamic",
          name: "question1",
          templateElements: [
            {
              type: "matrixdynamic",
              name: "question2",
              defaultValue: [
                {
                  "Column 1": 1,
                  "Column 2": 2,
                  "Column 3": 3
                },
                {
                  "Column 2": 4
                }
              ],
              columns: [
                {
                  name: "Column 1"
                },
                {
                  name: "Column 2"
                },
                {
                  name: "Column 3"
                }
              ],
              choices: [1, 2, 3, 4, 5]
            }
          ],
          panelCount: 1
        }
      ]
    }

Matrix dynamic should be with preset Column1, Column2 and Column3 for the first row and Column2 for the second row.

When creating pages for every question (`questionsOnPageMode == 'questionperpage') the newly created pages should inherit most (all?) properties from the original page.

Furthermore, if the original page has randomization enabled, the questions should be randomized before the new pages are created.

Most predictable would be to have all properties of the original page be copied to the new page.

The title adorner works for page titles and question titles. It wasn't possible to disable the title adorner for pages title only.

We introduced the titleAdorner.pageTitleEditable static option, switching page title in-place editing.