<mathInput/>

What it does

<mathInput/> is a Math component as well as an Input. It renders a user-input field that stores mathematical content. When referenced, a named <mathInput/> can be used in computations in the same manner as a <math> component.

<mathInput/> is frequently used in collecting student responses, either with or without response validation. To validate the value entered in a <mathInput/>, it must be nested within, or referenced by, an <answer>.

A <mathInput/> cannot be placed on a <graph> at this time, but a <textInput/> can be used to extract simple numerical values in a graphical context as a work-around. See Advanced Example here.

In addition, a <mathInput/> cannot function if nested within any Display Math type component, such as an <m>, <me>, <men>, <md>, or <mdn>.

Attributes and Properties

Attributes

• prefill
• prefillLatex
• format
• functionSymbols
• splitSymbols
• bindValueTo
• unionFromU
• hideNaN
• removeStrings
• minWidth

Properties

• attributes as properties
• value
• immediateValue
• immediateValueChanged
• text
• rawRendererValue

Example list

1. Assign a name to user-input math expression
2. Do some math with user-input
3. <mathInput/> with structured prefill

Example: Assign a name to user-input math expression

<p>Type <c>x^2 + sqrt4 - 1/y</c>: 
  <mathInput name="userExpression"/></p>
<p>You've typed: $userExpression</p>

A <mathInput/> renders an input field for storing and naming user-provided math expressions. Test code here (opens in a new tab).

Example: Do some math with user-input

<p>Enter <c>pi/4</c>: <mathInput name="userAngle"/></p>
  <p>
    <math name="sinOfUserAngle">sin($userAngle)</math> = 
    <number>$sinOfUserAngle</number>
  </p>

A named <mathInput/> can be referenced within a <math> for computations. Test code here (opens in a new tab)

Example: <mathInput/> with structured prefill

<p>Simplify.</p>
  <math>2/10</math> = 
    <answer symbolicEquality="true">
      <mathInput name="userFraction" prefill=" / "/>
      <award>1/5</award>
    </answer>
  <p>You answered $userFraction</p>

A <mathInput/> can incorporate a prefill with shaded blanks. Test code here (opens in a new tab)