Display the name instead of the value

Question

I am using a dropdown that lists a data set.

I created a treeBoxValue variable to assign a predefined dropdown value. Thus, when I open the dropdown, the elements that contain the value of the variable treeBoxValue are checked.

My problem is that the presentation of these default values should contain the name and not the value.

Can someone help me to show only the names and not the values?

DEMO

Problem: The dropdown shows the values and not the name:(

When I open the dropdown, the values change to the name. I intend to get the names right at the beginning.

Note: If the dropdown did not open, refresh only the preview page.

Answer 1

Change this line:

treeBoxValue = ["1", "2"];

to this:

treeBoxValue = [1, 2];

In your Books array the field idBook is numeric.

Books = [
    {
      idBook: 1,
      name: "name1"
    },
    {
      idBook: 2,
      name: "name2"
    },
    {
      idBook: 3,
      name: "name3"
    }
  ];