Introduce an option to override the choices separator used when choices are displayed in a list

[JaneSjs]

IMPLEMENTED

You can now use the settings.choicesSeparator property to specify one or several character used to separate choice options in a list:

import { settings } from "survey-core";

settings.choicesSeparator = "; "

Documentation

---

T18126 - Is it possible to change the ',' delimiter on multiple answers in the Table view? https://surveyjs.answerdesk.io/internal/ticket/details/T18126

---

https://github.com/surveyjs/survey-library/blob/78844a0961509ae5f2830f938bffe6529d7162a3/src/question_baseselect.ts#L1159

The getDisplayArrayValue function is used to generate a question display value. Display values are being used by SurveyJS Tabulator. In a user scenario, multi-select options may have a comma in their display texts. Therefore, using a comma as a multi-option answer is not suitable.

Please introduce an option which would allow developers to change the default display value delimiter.

[SamMousa]

It'd be more flexible if developers could provide their own formatter as a callback. That way you're not limited to just delimiters but can also do things like prefix / postfix.

[andrewtelnov]

@SamMousa It is already here.

Thank you, Andrew

[SamMousa]

Please introduce an option which would allow developers to change the default display value delimiter.

Then we shouldn't add a new option for a delimiter. Since a developer can just write their own implementation that replaces the delimiter in: return strs.join(", ");

[andrewtelnov]

@SamMousa It is a contant that is in the code. It is easy to change a contant instead of rewritting a lot of code. This setting will handle 90% scenarios.

Thank you, Andrew

[JaneSjs]

Thanks, @SamMousa, @andrewtelnov. I managed to override the display value using the survey.onGetQuestionDisplayValue event (demo).

survey.onGetQuestionDisplayValue.add((sender, options) => {
  const question = options.question;
  if(question.getType() === "checkbox"){
  var items = question.visibleChoices; 
  var strs = [];
  const vals = [];
  question.getMultipleSelectedItems().forEach((item, index) => strs.push(question.getItemDisplayValue(item, vals[index])));
  if (strs.length === 0) {
    for (var i = 0; i < vals.length; i++) {
      let valStr = question.getChoicesDisplayValue(items, vals[i]);
      if (valStr) {
        strs.push(valStr);
      }
      }
    }
    options.displayValue = strs.join("; ");
    }
});

However, I believe that a delimiter setting will be also useful.

@RomanTsukanov, please consider a new setting name.

[RomanTsukanov]

settings.choicesSeparator = ", "