Tuesday, September 24, 2013

How I managed to allow input of only 1 (one) character in a Cloze input box (Moodle 2.5)


Hi. Do you use the Cloze (also known as the multianswer) question type in Moodle 2.5? I use it a lot! 

For quite some time, I was struggling with how to limit a text box, in a Cloze question, to not more than one character of input. Well, after much searching for an answer on and almost the entire World Wide Web, I managed to do it.
INTRODUCTIONI had a quiz situation to solve. I had to create a Cloze question where the user has to type in the individual letters to complete a word. In this type of question, a box should contain at most only one letter.

I had to solve FOUR challenges/problems. 
PROBLEM ONE, each cloze input box should be small enough to look like it could only fit one letter.
PROBLEM TWO, the user should only be allowed to key in one letter inside each box. Not more than one letter. 
PROBLEM THREE, the user should be able to type continuously, the letters a, s, s, p, o, r, t and the letters should automatically be input into each successive input box.
PROBLEM FOUR, allow only letters - no spaces or punctuation symbols.
I have a nagging feeling that both problems ONE and TWO could be solved with some creative HTML/CSS and Javascript wizardary, but my desire to solve them come what may, led me to devise this core (unfortunately) code hack. Here's how I solved problems ONE and TWO:

Ratings and Recommendations by outbrain