Have the dynamic title render choices display text instead of value based on expression condition

[y0n4]

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

question - is there a way for the expression input to return display text instead of value in json template format?

What is the current behavior?

The expression input returns value which is more like a unique string rather than something to show to users

What is the expected behavior?

We would like to have the expression input return display text for the next question dynamic title

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

1. Select "Ford" in the first dropdown question- "Which is the brand of your car? *"
2. The text input will automatically reveal itself after the first question is answered
3. Notice that the text question says "What is your model of car-1? " (expected to be: "What is your model of Ford? ")

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

Tested page URL: https://codepen.io/y0n4/pen/ExzjbwE

Test code

// Just the json portion
const json = {
  elements: [
    {
      type: "paneldynamic",
      name: "carInfo",
      title: "Enter information about your car",
      panelCount: 1,
      confirmDelete: true,
      templateElements: [
        {
          type: "dropdown",
          name: "carBrand",
          title: "Which is the brand of your car?",
          isRequired: true,
          choices: [
            { value: "car-1", text: "Ford" },
            { value: "car-2", text: "Vauxhall" },
            { value: "other", text: "Other"}
          ]
        },
        {
          type: "expression",
          name: "carLogic",
          visible: false,
          expression: `iif({panel.carBrand} = "other", "Car Brand", {panel.carBrand})`
          // useDisplayValuesInDynamicTexts: false // I also gave this a try and it didn't work as well
        },
        {
          type: "text",
          name: "carModel",
          title: "What is your model of {panel.carLogic}?",
          visibleIf: `{panel.carBrand} notempty`,
          isRequired: true
        }
      ]
    }
  ],
  showQuestionNumbers: false
};

Specify your

• browser: chrome
• browser version: 124.0.6367.158
• surveyjs platform (angular or react or jquery or knockout or vue): react
• surveyjs version: 1.10.3

[JaneSjs]

Hello @y0n4, Thank you for the comprehensive explanation and demo. To access an item's display text, implement the survey.onGetExpressionDisplayValue and return an items display text instead of a value.

Consider the following code:

survey.onGetExpressionDisplayValue.add((sender, options) => {
    if (options.question.name === "carLogic") {
      const carBrandQuestion = options.question.parent.getQuestionByName(
        "carBrand"
      );
      const carBrandValue = carBrandQuestion.value;
      if (!carBrandValue) return;
      const carBrandDisplayText = Survey.ItemValue.getTextOrHtmlByValue(
        carBrandQuestion.choices,
        carBrandValue
      );
      options.displayValue = carBrandDisplayText;
    }
});

View CodePen

Please let me know if you have further questions.