How to get display value of multi select custom field

Hi, I have a Multi-Option Select custom field assigned to an entity type. When retrieving the content of the field for each entity, I only get what looks like an all caps slug version of the options.
For example, if the options are Apple, Passion Fruit, Orange - I get APPLE, PASSION_FRUIT, ORANGE
Sometimes I get something like OPTION_1, OPTION_2, ORANGE, which makes it impossible to “deslugify” it to get the original value.
How can I access the label (display value) instead?

Hi Andrea,

When you create the multi-option select field in the Knowledge Graph and fill in the available options, the platform automatically assigns an API name to each option. You can see that here in the Turtlehead Tacos example for the Restaurant Features field.

It’s not possible to edit these API names in the platform, but you can access the displayName property. The “slugified” version is under textValue. See Field under the Knowledge Graph API docs for more info.

Hi Kristy, Thank you for looking into this and for your reply, however I’m still not able to access the displayName or the textValue.
I should have mentioned that I’m working on the new React Pages.
In the stream fields I specify the custom field e.g.

stream: {
    $id: "location-stream",
    filter: {
      savedFilterIds: ["xxx"],
    },
    fields: [ "id", "name", "slug", "c_options" ]
[...]

and then later on I access it via document.c_options

I’m not able to specify c_options.displayName or c_options.textValue in either the stream or later on when accessing the variable.
Am I doing something wrong?

Hi Andrea. You can accomplish this by utilizing a stream transform. In particular you want replaceOptionValuesWithDisplayNames.

stream: {
    $id: "location-stream",
    filter: {
      savedFilterIds: ["xxx"],
    },
    fields: [ "id", "name", "slug", "c_options" ],
    "transform": {
        "replaceOptionValuesWithDisplayNames": [
            "c_options"
        ]
    },
[...]

Hi Andrea. You can accomplish this by using a stream transform. For this case, if you just want the display values of the option fields I believe you would want replaceOptionValuesWithDisplayNames. Otherwise you can use expandOptionFields which should provide you more information, including the selected status and display name of each option.

For your example that would look like:

stream: {
    $id: "location-stream",
    filter: {
      savedFilterIds: ["xxx"],
    },
    fields: [ "id", "name", "slug", "c_options" ],
    transform: {
      replaceOptionValuesWithDisplayNames: [
        "c_options"
      ]
    }
[...]

Hi @Andrea_Gentile ,

You can also read more about this in our reference article as well; this shows you the full list of available properties in your Stream configuration.

You have access to two transform options for single/multi-option select fields:

  1. transform.replaceOptionValuesWithDisplayNames - returns the display names (instead of internal IDs) for only the selected values; note, if you’re building a multi-language site, you’ll want to ensure your options have “translations” defined per language
  2. transform.expandOptionFields - returns you all possible options (even if they aren’t selected).

Let us know if you have any other questions!

Thank you Joe and Luc, this is great! I didn’t know about this feature (or I forgot about it from the training) and it’s going to be very useful.