This component is meant to display non-interactive text delivered by the tutor; it supports arbitrary HTML. It is not intended to be a component that students edit. The text displayed can be static or set dynamically using mass production or tutor-performed steps.

Forcing a CTATTextField to be student editable is discouraged because of the potential havoc a student could inflict on the tutor.

<div id="problem_statement" class="CTATTextField">Find the least common denominator.</div>

CTATTextField Example

• id: Required. The name of the component, must be a valid html id name.
• class: Required. The class list, must include CTATTextField and no other CTAT<component> classes.
• data-ctat-enabled: true or false. Default is false. Controls if the component will accept student interaction.
• data-ctat-tutor: true or false. Default is true. Controls if direct actions on the component trigger grading.
• data-ctat-show-feedback: true or false. Default is true unless data-ctat-tutor="false". Determines if grading feedback is shown on the component.
• data-ctat-show-hint-highlight: true or false. Default is true. Determines if hint highlighting is shown on the component.
• data-ctat-disable-on-correct: true or false. Default is true. Determines if the component becomes locked when it is graded as correct.

This component is forced to be disabled initially.

In addition to the common Actions listed in Often Used TPAs this component supports the following actions:

.CTATTextField {}

Example for mass producing the text for a CTATTextField :

<div id="problem_statement" class="CTATTextField">%(problem-text)%</div>