Components
Created by Smart Sparrow

Fill in the Blank - Free text

The Fill in the Blank widget allows learners to input an answer (text or number) to complete a paragraph of text.

Unique ways to use this widget

There are multiple ways you can use this widget. For example:

  • Ask students to correctly use key terms in a paragraph.
  • Construct a word equation to identify the correct reactants and products in a chemical reaction.
  • Ask them to add a conclusion sentence to the end of a paragraph.
  • Ask them to fill in details in an excerpt from a scientific text.
  • Ask them to fill in the missing numbers from a sentence.

 

Have a play

 

Basic setup instructions

  1. This component can be found in the Author. Insert the widget from the Components tab and resize it to your liking.
  2. With the component selected, Click on Configure and select Options to set it up.
  3. You must change the Mode to Config mode to set up the widget.
  4. Enter your text in the widget box and click where you’d like to insert a text field for students to write their responses.
  5. Write down the expected answers directly in each text boxes you created.
  6. Before deploying your lesson to students, make sure you switch the widget from Config Mode into Student Mode.

 

Other options

  • The Show Solution CAPI property can be used to display all correct answers to students. You also have the ability to also display the correct answer for each specific text boxes.
  • The Show Validation CAPI property highlights correct answers in green and highlights incorrect answers in red. This can be useful as a hint for students as adaptive feedback. You also have the ability to also display validation for each specific text boxes.
  • The Enabled CAPI property allows you to enable/disable the widget as a whole or any individual text boxes.

 

FAQs

Q: I’ve set up my widget, but when I preview it I can’t complete the activity the way students should. A: This is because you still have the widget set to “Config” mode. Use the edit icon on the Widget’s iFrame to change it to “Student” mode. Whenever you want to make changes to the widget, switch it back to “Config” mode.

Q: Why use the Fill-in-the-Blank widget instead of Dropdown or Text input? A: HTML does not render text the same in every browser. If you try to align drag-and-drop or other inputs with additional text boxes, the formatting is not guaranteed to appear the same for every learner. Using the fill-in-the-blank widget ensures that the inputs and their surrounding text are always properly aligned.

 

Capi Table

Property Purpose Acceptable Inputs Readable Writable
Inputs.{id}.Is Correct
Reports whether the currently selected value is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if their answer is correct/incorrect
Boolean
Inputs.{id}.Show Solution
Sets the currently selected value to the correct solution
Boolean
Inputs.{id}.Enabled
Enables/disables the drop down
Boolean
Inputs.{id}.User Modified
Reports whether the student has made a change to this input.
Boolean
Inputs.{id}.Selected Index
Reports which option is currently selected. For example, if the first option is selected, this reports 0.
Number
Is Correct
A flag to show if all inputs are correct
Boolean
Show Validation
Show the student if his/her answer is correct/incorrect for all inputs
Boolean
Show Solution
Sets all inputs to their correct solutions
Boolean
Enabled
Enables/Disables for all inputs
Boolean
User Modified
Reports whether the student has made a change to this input.
Boolean
Form Validation
Global form validation switch which enables/disables form style validation for all dropdowns.
Boolean
Inputs.{id}.Is Correct
A flag to show if the input of Input ID is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if his/her answer is correct/incorrect for input of Input ID
Boolean
Inputs.{id}.Show Solution
Sets the input of {Input ID} to the correct solution
Boolean
Inputs.{id}.Enabled
Enables/Disables the input of Input ID
Boolean
Inputs.{id}.Value
The value that is currently selected/written in the input of Input ID
String
Mode
Mode of the widget
Config
Student
Config JSON
The configuration data for the widget.
String
Custom Css
Custom CSS
String
Persist.Sim ID
Sim ID to persist the widget state under.
String
Persist.Key
Key to persist the widget state under.
String
Inputs.{id}.Is Correct
Reports whether the current value is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if their answer is correct/incorrect
Boolean
Inputs.{id}.Show Solution
Sets the value to the correct answer
Boolean
Inputs.{id}.Enabled
Enables/disables the text input
Boolean
Inputs.{id}.User Modified
Reports whether the student has made a change to this input.
Boolean
Inputs.{id}.Current Value
Reports what the current value of the text input is
String
Inputs.{id}.Placeholder
Sets the placeholder for the input field
String
Property Purpose Acceptable Inputs Readable Writable
Inputs.{id}.Is Correct
Reports whether the currently selected value is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if their answer is correct/incorrect
Boolean
Inputs.{id}.Show Solution
Sets the currently selected value to the correct solution
Boolean
Inputs.{id}.Enabled
Enables/disables the drop down
Boolean
Inputs.{id}.User Modified
Reports whether the student has made a change to this input.
Boolean
Inputs.{id}.Selected Index
Reports which option is currently selected. For example, if the first option is selected, this reports 0.
Number
Is Correct
A flag to show if all inputs are correct
Boolean
Show Validation
Show the student if his/her answer is correct/incorrect for all inputs
Boolean
Show Solution
Sets all inputs to their correct solutions
Boolean
Enabled
Enables/Disables for all inputs
Boolean
User Modified
Reports whether the student has made a change to this input.
Boolean
Form Validation
Global form validation switch which enables/disables form style validation for all dropdowns.
Boolean
Inputs.{id}.Is Correct
A flag to show if the input of Input ID is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if his/her answer is correct/incorrect for input of Input ID
Boolean
Inputs.{id}.Show Solution
Sets the input of {Input ID} to the correct solution
Boolean
Inputs.{id}.Enabled
Enables/Disables the input of Input ID
Boolean
Inputs.{id}.Value
The value that is currently selected/written in the input of Input ID
String
Mode
Mode of the widget
Config
Student
Config JSON
The configuration data for the widget.
String
Custom Css
Custom CSS
String
Persist.Sim ID
Sim ID to persist the widget state under.
String
Persist.Key
Key to persist the widget state under.
String
Inputs.{id}.Is Correct
Reports whether the current value is correct/incorrect
Boolean
Inputs.{id}.Show Validation
Show the student if their answer is correct/incorrect
Boolean
Inputs.{id}.Show Solution
Sets the value to the correct answer
Boolean
Inputs.{id}.Enabled
Enables/disables the text input
Boolean
Inputs.{id}.User Modified
Reports whether the student has made a change to this input.
Boolean
Inputs.{id}.Current Value
Reports what the current value of the text input is
String
Inputs.{id}.Placeholder
Sets the placeholder for the input field
String

 

Advanced widget setup

Contact our team for help setting up the widget and trap states in your lessons.

Want to work with us to create your own component?
Request services