<matrixInput/>

<matrixInput/> is an Input component renders an empty matrix with blanks for user-input of entries.

Attributes and Properties

Example: Default <matrixInput/>

The default <matrixInput/> contains a single input blank. Additional rows and columns are added with rendered size control buttons.

Example: A blank 2x3 <matrixInput/>

To show a <matrixInput/> of a specific, unchangeable size, use the numRows and the numColumns attributes. Set the showSizeControls attribute to false to prevent the user from altering the size.

Example: Retrieving an entry from a <matrixInput/>

Individual entries of the matrix can be accessed using array notation with the matrix property.

Example: Operations with <matrixInput/> - defined matrices

Basic matrix operations can be performed with named <matrixInput/> components. See the <matrix> component for additional examples.

Example: Prefill a <matrixInput/> with a <matrix>

To easily prefill a <matrixInput/> with specific entries, first define a <matrix> and reference it by name within the prefill attribute of the <matrixInput/>.

Attribute Example: numRows / numColumns

<matrixInput name="A" numRows="2" numColumns="3"/>
<p><m>A = $A</m></p>

A <matrixInput/> of a specific size can be initialized with the numRows and the numColumns attributes.

Attribute Example: showSizeControls

<p>Show size controls: 
  <booleanInput 
    name="buttonsOn" 
    prefill="true"
  /> $buttonsOn 
</p>
 
<p><m>A = </m>
  <matrixInput 
    name="A" 
    numRows="2" 
    numColumns="3" 
    showSizeControls="$buttonsOn"
  />
</p>

The default size control buttons can be hidden by setting the showSizeControls attribute to false.

Attribute Example: prefill

<matrix name="prefillMatrix">
  <row>1 2 3</row>
  <row>4 5 6</row>
</matrix>
 
 
<p><m>A = </m>
  <matrixInput name="A" prefill="$prefillMatrix"/>
</p>      

To easily prefill a <matrixInput/> with specific entries, first define a <matrix> and reference it by name within the prefill attribute of the <matrixInput/>.

Attribute Example: defaultEntry

<matrixInput 
  name="A" 
  numRows="2" 
  numColumns="3" 
  defaultEntry="1"
/>
 
<p><m>A = $A</m></p>    

Use the defaultEntry attribute to change the prefilled value for a matrix of a specified size; the default value is an empty input box.

Attribute Example: format

The format attribute gives the option for prefilled <matrixInput/> components to contain content formatted in LaTeX. If supported, expressions entered in the prefill of the <matrixInput/> will be parsed by Doenet as math components and may be used in further computations.

Attribute Example: functionSymbols

The functionSymbols attribute is used to specify when a character is formatted as a function that takes an argument in parentheses. Default = “f”, “g”; type = textList

Try deleting the specification functionSymbols="f g h" from the example above to observe the difference in the simplification of $A^2$.

Attribute Example: splitSymbols

The splitSymbols attribute is used to modify the default mathematical simplification of multicharacter values in a <mathInput/> (think of each entry in a <matrixInput/> as a <mathInput/>). By default, Doenet assumes adjacent characters are single variables multiplied together, and “splits” them during parsing. So, for example, multicharacter values such as xyz are interpreted as the product $x \cdot y \cdot z$. However, if you wish to treat a grouping of symbols as a single variable, you can turn off this behavior by specifying splitSymbols="false".

Attribute Example: bindValueTo

The bindValueTo attribute is used to create a bidirectional link between the value of a <matrixInput/> and that of another component. This attribute accepts a reference to a named math component or the property of a named component as input.

Attribute Example: minComponentWidth

The minComponentWidth attribute adjusts the width of the individual <mathInput/> components within the <matrixInput/>.

Property Example: Attributes as properties

The attributes shown above are also accessible as properties.

Property Example: valueChanged / immediateValueChanged

The valueChanged property returns the boolean value of whether the <matrixInput/> has been changed by the user when the page is updated (which occurs when the user clicks elsewhere, hits Enter, or interacts with another part of the page).

The immediateValueChanged property returns the boolean value of whether the <matrixInput/> has been changed by the user immediately as they are typing into the input.

Property Example: value / immediateValue

The value property returns the value stored in the <matrixInput/> since the most current page update (which occurs when the user clicks elsewhere, hits Enter, or interacts with another part of the page).

The immediateValue property returns the value stored in the <matrixInput/>, updated immediately as the user is typing it in.