Option Links (4.4)

This article applies to versions 4.4 and later of P2 Explorer. For more, see Release History. For the latest help, see Option Links.

Overview

The Option Links are used for selecting a single value, such as an accounting period.

Option Links provide interactivity on your pages. You can pass the selected value to other components on the page, using a variable set in the Option Link's Selected Option property.

The Option Links component is similar to the Combo Box. Option Links displays options as a row of buttons, while Combo Box displays options as a list.

The following diagram shows a grid layout with an Options Link component displaying a year's quarters:

Option Values: These are the options that set the variable defined in Selected Option. Option Names: If specified, then this is the text displayed on the option links buttons. Each value in Option Names is linked to the corresponding (by list position) value in Option Values. If Option Names are unspecified, then Option Values are displayed. Selected Option: The variable that uses the selected Option Value.

1: Here you can see Option Names displayed in the Option Links. 2: Quarter 2 is the selected button. 3: Q2 corresponds to Quarter 2, each being in the second position on the Option Values and Option Names list, respectively. Thus the Option Value of Q2 is assigned to the Selected Option, selectedQuarter.

Related: Using Option Links in display mode, Adding a new Option Links style

---

Tutorial 1: Adding Option Links with Default Value

If you're unfamiliar with the process of building pages, read the article Building an Explorer Page.

In this tutorial, we'll add a simple Option Links component, and give it a default value.

Note: Before you start the tutorial, prepare a page in Studio.

Step 1. Add Option Links to the Page.

Drag and drop an Option Links component onto a grid cell. The Option Links is in the Control  group.

Step 2. Configure the Option Links

In this example we will use values for the Option Values and Option Names, by selecting the Values data category.

Click the Option Links component to configure it:

1. Add Option Values: Follow the instructions in Using Value Data to add the following list of values: Q1, Q2, Q3 and Q4.       2. Add Option Names: Follow the instructions in Using Value Data to add the following list of values: Quarter 1, Quarter 2, Quarter 3 and Quarter 4.       3. Add Selected Option: In the Selected Option drop-down list, type selectedQuarter.

Next, open the Default Values panel:

4. Add a Default Value: In Default Values, add a default pair: selectedQuarter (Variable Name) of type Text, and Q2 (Default Value). See how to add Default Values.

In preview mode, the Option Links shows the four Option Names, with Quarter 2 selected.

---

Advanced Tutorials

These tutorials demonstrate how to get your option links to interact with other controls on an Explorer page.

We will be using the basic Option Links created in Tutorial 1.

Tutorial 2: Option Links Controlling Text Label Content

Option Links provide a way for the user to interact with other controls.

To demonstrate this, we'll add Option Links that change the content of a Text Label.

Before you start, open the page you created in Tutorial 1:

See how to add and configure a text label: Text Label.

Step 1. Add a Text Label to the Page:

Drag and drop a Text Label component onto a grid cell.

Step 2. Add Content:

In the Content, type: "The selected Quarter is:" then click Add Data and add selectedQuarter.

This is how your Text Label looks:

Watch the video below to see how changing the Option Links selections changes the Text Labels' content (the variable portion of the text label: selectedQuarter), in preview mode.

Related: See how the Combo Box (similar to Option Links) uses the Selected Option variable to control a chart's dataset parameters in the Charts article.

 

Tutorial 3: Option Links Using Dataset Values

In this tutorial, we'll add another Option Links component, this time using a dataset query for the Option Values. Alternatively, you can edit the Option Links created in Tutorial 1.

Note: This configuration uses the Sample Data table and datasets that can be optionally made available during initial installation and setup. If you don't have access to this data, you will need to adjust the configuration to suit your data at your site.

Before you start, open the page you created in Tutorial 1:

Step 1. Add Option Links to the Page.

Drag and drop an Option Links component onto a grid cell.

Step 2. Configure the Option Links

In this example we will use a dataset for the Option Values, by selecting the Dataset data category.

This time, we will leave out the Option Names to demonstrate how the Option Values display in the Option Links when Option Names are undefined.

Click the Option Links component to configure it:

1. Add Option Values: Follow the instructions in Using Dataset Data to a list using a dataset Value Column. Use the following, when setting up the data: Dataset Query: AccountingProdAmtsDisplayMth Value Column: rpt_year Dataset Parameters: displayMth: Jan Note: If you do not have access to this data, substitute with your own dataset query.       2. Add Selected Option: In the Selected Option drop-down list, type selectedYear.

In preview mode, this is what the Option Links data looks like.

In preview mode, the Option Links shows the rpt_year columns from the query.

Note how none of the options is selected (underlined). This is because we have not set up a default value for the variable, selectedYear

---

Release History

• Option Links 4.3.2