Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Allowing users to input correct answers in HTML Text Box

I'm new to twine but I do a bit of coding and I've used similar programmes before. I've seen that you can use <<textinput>> to allow users to type in some text, and that text will be set to a variable. What I want to do is have the text be conditional, so that users have to input pre-defined 'answers' to move on to the next passage. For example, a passage might read "What is the name of the current Queen of England?" and users would have to input "Elizabeth" or something along those lines to move to the next passage. I realise this would probably mean defining a few correct answers. How would this be done?


  • I have a script that does just that, but it will only work in Harlowe. What format are you using?
  • I was just going to stick with Harlowe for now as I'm not used to the program.
  • Ok, using Harlowe, try the following:
    (set: $password to (prompt: "What is the password?") )
    (if: $password is "secret")[You are correct. [[Ok now, onwards.]] ](else:)[You
    are wrong. [[Try again->Enter the password]].]

    Where "secret" is the password you wish to set
  • I've seen that you can use <<textinput>> to allow users to type in some text
    That is a SugarCube macro, and unfortunately Harlowe does not have a built-in equivalent so you will need to use Javascript to implement what you want.

    Because you want to save the text entered by the Reader into a variable the following solution which is based on this hack worked out by csalzman.

    The following code needs to be placed within your Story Javascript area, it adds a customScripts.updateNamedHook method which can be used with either a Text Field or a Text Area.
    if (typeof window.customScripts == "undefined") {
    	window.customScripts = {
    		updateNamedHook: function(hookName) {
    			var value = $("input[name='" + hookName + "'], textarea[name='" + hookName + "']")[0].value;
    			// Find the named hook node and set the text inside.
    			$("tw-hook[name*='" + hookName + "']").text(value);

    The following code needs to be placed within a passage, it asks question and checks the answer. The supplied answer is converted to lower-case before being compared to the correct answer because you cant control the letter casing the Reader may use.
    (set: $queensName to "Unknown")
    What is the name of the current Queen of England? [$queensName]<fname|
    <input type="text" name="fname" value="">
    <button type="submit" onclick="customScripts.updateNamedHook('fname')">Answer</button>
    	(set: $queensName = ?fname)
    	(if: $queensName.toLowerCase() is "elizabeth")[
    		(go-to: "Next Passage")
Sign In or Register to comment.