Writing Exercises: Answer Types

Answer Types

There are a few answer types available. You can specify what type of answer is expected by using the data-type attribute on the .solution element.

text ()

This is the default form. It compares the answer strings literally; no numerical interpretation is done at all (e.g., 1.0 would not be marked correct if the answer was 1, even though they're numerically equal). The only text transformation is to strip leading and trailing whitespace before comparison.
radio (default if ul.choices present)

If you want the user to pick an answer from a list, you can provide the possible choices that you want the user to select from, using an un-ordered list. You'll need to add an UL with a class of choices inside of your main problem container.
```
<code><var>A</var>x <var>BP + B</var></code>
<ul class="choices">
 <li><code><var>-1 * A</var>x <var>BP + B</var></code></li>
 <li><code><var>A</var>x <var>BN + (-1 * B)</var></code></li>
 <li><code><var>B</var>x <var>AP + A</var></code></li>
 <li><code><var>-1 * B</var>x <var>AN + (-1 * A)</var></code></li>
</ul>
```
The above markup will generate a problem that has 5 possible choices to choose from, one of which is the valid solution. Note that when you use multiple choice formatting you can let the user pick from more-complicated answers (such as formulas).

The framework also gives you the ability to provide more possible choices than what may actually be displayed. For example you could provide a total of 5 choices (1 solution + 4 other choices) but only show 3 of them (1 of which will always be the valid answer).
```
<ul class="choices" data-show="3"> ... </ul>
```
Additionally the framework provides a mechanism for supplying a "None of the above" choice as a viable option. All you would need to do is supply a data-none="true" attribute on your choices UL to enable it, like so:
```
<ul class="choices" data-show="5" data-none="true"> ... </ul>
```
In this example, 5 possible choices will be displayed - one of which will be the "None of the above" choice. It's possible that the valid solution will be hidden and that "None of the above" will be the correct answer.
list If your exercise involves asking the user something like an inequality, where you want the answer or part of the answer to be one of a list of options, you can have the answer come from a drop down menu.

Here is an example of how this works:
```
 
 <code>x</code>
 
 
 <var>( D - B ) / ( A - C )</var>
```
This produces drop down menu in the answer area with <, >, <= and >= options and then a free answer box with type rational. Thus, the list answer type takes in an array and outputs a drop down menu.
category (a type of radio)

If your exercise involves asking the user to choose from the same set of choices displayed in the same order every time, supply a data-category="true" attribute. Note that you should supply the solution in the unordered list as well (Normal radio answers only have wrong answers in the unordered list.).
```
<div class="solution">Acute</div>
<ul class="choices" data-category="true">
 <li>Acute</li>
 <li>Right</li>
 <li>Obtuse</li>
</ul>
```
decimal(decimal)

Just like text except it compares numerical equality. With decimal, 1.0 is the same as 1 is the same as 1, but no other evaluation is done so fractions and the like don't work.
```
1.0
```
rational

Compares two fractions for equality. Under the hood, it converts both to decimals so the contents of p.solution should actually be a decimal version of the correct answer. You can accomplish this using var:
```
<var>2/3</var>
```
By default, answers must be reduced to be considered correct. (4/6 would not be a correct answer.) If you want to specifically allow unsimplified answers, add data-simplify="optional" to the element containing the solution.
radical

Use this type if your answer involves a radical, like in the Simplifying Radicals exercise. Specify the coefficient and the part under the radical in separate span tags.
```
<div class="solution" data-type="radical">
 <var>COEFFICIENT</var><var>RADICAL</var>
</div>
```
line

Use this if the answer is a function, like 2(3x + 7)/5. Currently being developed, see the equation of a hyperbola for an example of use.
regex

Just what it sounds like. Omit the delimiting slashes but include ^ and $ if appropriate. To match the four smilies :), ;), :P, ;P:
```
^[:;][\)P]$
```
multiple

This special type allows you to have a composite of other answer forms as an answer. The "Equation of a line" exercise uses this to ask the user for the slope m and y-intercept b of a line:
```
<div class="solution" data-type="multiple">
 <code>m</code> = <var>M</var>
 <code>b</code> = <var>B</var>
</div>
```
The code inside the solution will be copied into the solution area and each .sol element will be interpreted as if it was its own answer. In this case, you'll get a form that asks for m and b and gives two separate text entry boxes. Since data-type="rational" was specified on each .sol element, each text box acts like a single rational answer.

Answers are marked correct only if all of the parts are correct. Having a radio input as a part of an answer has not been tested. (You probably don't need more than one radio input, anyway.)

Since multiple-type answers can vary wildly in what they expect from the user, the framework won't show the predefined "acceptable answers," unlike with most of the default answer types. Instead, you should define your own examples inside the solution block to help the user answer properly:
```
<div class="solution" data-type="multiple">
 <code>m</code> = <var>M</var>
 <code>b</code> = <var>B</var>
 <code>m</code> = a simplified proper fraction, like <code>3/5</code>
 <code>b</code> = a simplified proper fraction, like <code>2/5</code>
</div>
```

Back to Writing Exercises: Home

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Writing Exercises: Answer Types

Answer Types

Clone this wiki locally