`<booleanInput>`

An interactive boolean (toggle/checkbox) input

<booleanInput> is an Input component that renders a checkbox. If the box is checked by the user, Doenet stores the boolean value true in the named <booleanInput>.

Attributes and Properties

Attributes for `<booleanInput>`

Labels (1)

labelIsName

boolean. Default value: false. Whether to use this component's name as its rendered label.

Positioning (2)

anchor

point. Default value: $\left( 0, 0 \right)$. Coordinates of the anchor point used to position this component on a graph.

positionFromAnchor

keyword. Where this component sits relative to its anchor point.

Value	Description
`upperRight`	Place the component above and to the right of the anchor point.
`upperLeft`	Place the component above and to the left of the anchor point.
`lowerRight`	Place the component below and to the right of the anchor point.
`lowerLeft`	Place the component below and to the left of the anchor point.
`top`	Place the component directly above the anchor point.
`bottom`	Place the component directly below the anchor point.
`left`	Place the component directly to the left of the anchor point.
`right`	Place the component directly to the right of the anchor point.
`center` (default)	Center the component on the anchor point.

Other (6)

asToggleButton

boolean. Default value: false. Whether to render the input as a toggle button rather than a checkbox.

bindValueTo

boolean. Two-way binding target for the input's value.

draggable

boolean. Default value: true. Whether the input can be dragged on a graph by its anchor.

forAnswer

reference. References to <answer> elements that this input should submit to.

labelPosition

keyword. Position of the label relative to the input.

Value	Description
`left`	Place the label to the left of the input.
`right` (default)	Place the label to the right of the input.

prefill

boolean. Default value: false. The initial value of the input before the student interacts.

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 `<booleanInput name="b">`

Labels (2)

$b.label

label. The label rendered with this component.

$b.labelIsName

boolean. Whether to use this component's name as its rendered label.

Positioning (2)

$b.anchor

point. The coordinates where this component is anchored on the graph.

$b.positionFromAnchor

text. Where this component sits relative to its anchor point.

Other (13)

$b.asToggleButton

boolean. Whether to render the input as a toggle button rather than a checkbox.

$b.disabled

boolean. Whether this component is disabled and cannot be interacted with.

$b.draggable

boolean. Whether the input can be dragged on a graph by its anchor.

$b.fixed

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

$b.fixLocation

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

$b.focused

boolean. Whether this input currently has keyboard focus.

$b.hidden

boolean. Whether this component is hidden from the rendered output.

$b.labelPosition

text. Position of the label relative to the input.

$b.prefill

boolean. The initial value of the input before the student interacts.

$b.shortDescription

text. A short accessibility description of this input; it is visible to screen readers but not rendered visually.

$b.text

text. The current value rendered as a text string ("true" or "false").

$b.value

boolean. The current boolean value of the input.

$b.valueChanged

boolean. Whether the input's value has been changed from its prefill value.

Common to all components (4)

$b.doenetML

text. The DoenetML source code that produced this component.

$b.hide

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

$b.isResponse

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

$b.styleNumber

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

Examples

Example: `<booleanInput>` survey question

A <booleanInput> component renders a checkbox whose value is stored as true if the box is checked.

Example: `<booleanInput>` to show/hide graph elements

The <booleanInput> component can be used to provide user-control over the values of attributes that accept a boolean, such as the <graph> attribute grid, and the general attribute hide available to all rendered components.

Example: `<booleanInput>` with a label

A <label> child can be nested within a <booleanInput> to create a label.

Attribute Examples

Attribute Example: prefill

The <booleanInput> component is false initially by default. Use the prefill attribute set to true to reverse this behavior.

Attribute Example: asToggleButton

The asToggleButton attribute changes the default rendering format from a checkbox to a toggle button.

Attribute Example: labelIsName

The labelIsName attribute can be used as a shortcut to adding a <label> child.

Attribute Example: bindValueTo

A <booleanInput> is used to simulate a light switch using the bindValueTo attribute. The behavior of the <booleanInput> checkbox is tied to the <boolean> that is named onBoolean within the bindValueTo specification. When the user’s <textInput/> has value ON, the condition inside the <boolean> becomes true, which in turn causes the <booleanInput> to take on the value true, and the checkbox, or “lightbulb” becomes checked.

Property Examples

Property Example: value

The value property of a named <booleanInput> returns its value of true or false.

Property Example: text

The text property of a named <booleanInput> returns the text value of true or false.

Property Example: Attributes as properties

The above listed attributes of a <booleanInput> are also available as properties.

boolean booleanList

<booleanInput>