Referenceselect

<select>

Randomly selects components from a list of children to create document variants

<select> is a General Operator component that selects values from a list or from a group of nested <option> components at random. Selections generate variants of the document.

For fine-grained control over which option appears in which named variant of the document, see the selectForVariants attribute on <option> — it lets you pin specific options to specific variants instead of relying on random selection.

Attributes and Properties

Attributes for <select>

Other (4)
asList

boolean. Default value: true. Whether to render the items separated by commas (true) or with no separator (false).

integer. Default value: 1. How many child components to select.

text. Component type to select from.

boolean. Default value: false. Whether the same child can be selected more than once.

Common to all components (9)
copy

reference. Create an independent copy of another component by reference. Enter a references a $name.

disabled

boolean. Default value: false. Whether this component is disabled and cannot be interacted with.

extend

reference. Extend another component by reference, inheriting its children and attributes. Enter a reference as $name.

fixed

boolean. Default value: false. Whether this component's value is fixed and cannot be modified.

fixLocation

boolean. Default value: false. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

hide

boolean. Default value: false. Whether to hide this component from the rendered output.

isResponse

boolean. Default value: false. Whether this component is treated as a response for the purposes of assessment.

name

text. The name used to reference this component from elsewhere in the document.

styleNumber

integer. Default value: 1. The style number used to select this component's visual styling from the available style definitions.

Properties for <select name="s">

Other (2)
$s.numToSelect

integer. How many child components to select.

$s.withReplacement

boolean. Whether the same child can be selected more than once.

Common to all components (4)
$s.doenetML

text. The DoenetML source code that produced this component.

$s.hide

boolean. Whether to hide this component from the rendered output.

$s.isResponse

boolean. Whether this component is treated as a response for the purposes of assessment.

$s.styleNumber

integer. The style number used to select this component's visual styling from the available style definitions.

Examples

Example: Default <select>

The default selection type is math. If options are simple math expressions these can be placed in a space-selected list between the opening and closing <select> tags.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Example: <select> from a set of texts

A text is selected from a group of options.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Example: <select> components of multiple types

Multiple component types can be selected together within a single option, as a group. In order to reference a child of an <option> that has been selected, first use the index of the selection desired (in the case of muliple selections), then either (1) the desired child can be referenced by index or (2) the desired child can be given a name (make sure to create the same names for that particular child over the range of all possible options) and then referenced by name.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Example: <select> paired values

In this example, two pairs of values are assigned to each <option> within the <select> component. In the references shown in this example, the first index refers to the selection made from the <select> component, and the second index refers to the child component within the <option> that was selected.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Example: <select> random functions for graphing

In this example, two <function>s are randomly selected from a list of <option> components nested within a <select>. The final functions are further varied by specifying coefficients and constants that have been generated using a <selectFromSequence/> component. Note that the selected coefficients have been renamed as numbers for simplicity when writing the function formulas.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Example: Assigning names to selected values

The <select> component is used to randomly select three <math> values using the numToSelect attribute.

As an author, it can sometimes become tedius to refer to indexed values (such as s[2]) every time you want to reference a selected value in subsequent code. If this is the case, descriptive names can be assigned to each selection by defining unique components which reference individual selected values.

Different page variants (which can be accessed from the left-side menu) will have different selected <math> values.

Attribute Examples

Attribute Example: numToSelect

The numToSelect attribute sets how many values are chosen from the options. The default value is 1. When more than one is selected, the individual selections are accessed by index (for example, $s[1]). Without withReplacement, each option can be chosen at most once.

Select a new page variant from the pulldown menu at the top of the editor to see different variants of the document.


Attribute Example: withReplacement

Use the withReplacement attribute if the options listed may be selected more than once.


Attribute Example: type

The type attribute alerts Doenet to the type of component to select. The default type is math; therefore, text will render as math unless otherwise specified.