Design Studio listbox usage

In this case a LISTBOX is read and a filter is set on DS_1 data source. Also an extra text item is being filled with the chosen values to be displayed elsewhere on the canvas.

On Startup script code.

LISTBOX_REGION.setItems(DS_1.getMemberList(“0REGION”, MemberPresentation.INTERNAL_KEY, MemberDisplay.TEXT, 10));

LISTBOX_REGION.addItem(“All”, “All regions”, 0);

LISTBOX_REGION.setSelectedValue(“All”);

There is an extra entry added at the start of the list, this is also the default selection (all entries).

The listbox looks like this.

The extra text component All will be made visible when necessary.

LISTBOX_REGION On Select script.

var lv_select_arr = me.getSelectedValues();

var lv_selecttext_arr = me.getSelectedTexts();

var lv_element = [“”];

var lv_text = “”;

1. me.removeItem(“All”);

TEXT_ALLE_REG.setVisible(true);

lv_select_arr.forEach(function(element, index) {

         lv_element.push(element);

         });

         DS_1.setFilter(“0REGION”, lv_element);

lv_element = [“”];

lv_selecttext_arr.forEach(function(element, index) {

         lv_element.push(element);

         lv_text = lv_text + “, “+ element;

         });

TEXT_A_REG.setText(Convert.subString(lv_text, 1));

The last line of code shows the chosen entries in a TEXT element and takes away the extra first comma.

Since “All” was placed as an extra first option in the initial list, it’s been taken away again when multiple selection is made.

Also an extra TEXT element named All has an event and is added onto the top right of the LISTBOX.

TEXT_ALL_REGION On Select script.

LISTBOX_REGION.setItems(DS_1.getMemberList(“0REGION”, MemberPresentation.INTERNAL_KEY, MemberDisplay.TEXT, 20));

LISTBOX_REGION.addItem(“All”, “All regions”, 0);

LISTBOX_REGION.setSelectedValue(“All”);

TEXT_A_REG.setText(LISTBOX_REGION.getSelectedText());

DS_1.clearFilter(“0REGION”);

me.setVisible(false);

This makes it possible to return to all entries after a multiple selection is made.