How to make the player have an text box to put their answer?
renzlorenzz
10 Feb 2017, 13:33I'm going to put quizzes and riddles on my game where the player need to type their answer,
for example :
The first letter of the alphabet is A, and the letter B comes after the letter A.
However, the letter you need to worry about is the last one. What's the last letter of the alphabet?
Here's a hint: it isn't Z.
the answer will be letter T and I want the player to put their answer on a text field.
how can I do that on squiffy? I don't like the windowed one.
thetruespin
10 Feb 2017, 21:03Your going to need a bit of html and Javascript.
Basically you can create an input field using bog standard html, give it a class name and then create a link to the next section.
In the next section include something like:
var myvariable = document.getElementById("classname").value;
This will convert whatever string is in the input field into a JS variable. Then you can do whatever you want with it, including checking for valid entries.
Be warned, Squiffy does not preserve JS variables, so if you need it at a later point you'll need to convert it again into a Squiffy attribute. You can then convert back and forth when required.
![](https://i.imgur.com/mpaalk0b.jpg)
manowar
10 Feb 2017, 22:41You can see an example here:
http://textadventures.co.uk/forum/squiffy/topic/dnaov0xdmumoxdy9g85eeq/textareas-in-squiffy
renzlorenzz
11 Feb 2017, 12:35[[first]]:
The first letter of the alphabet is A, and the letter B comes after the letter A.
However, the letter you need to worry about is the last one. What's the last letter of the alphabet?
Here's a hint: it isn't Z.
</input type='text' id='answer'/> (I inserted the slash so it can display the code)
[[submit]]
[[submit]]:
{var answer = document.getElementById("answer").value;}
{answer}
is this how it should work? I'm getting values as NULL
thetruespin
11 Feb 2017, 18:15Using {answer} calls a Squiffy attribute.
You haven't set a Squiffy attribute, only a javascript variable.
You need to add the following:
squiffy.set("answer", answer);
This takes your JS variable and turns it into a Squiffy attribute.
I'd use some different names a it's getting confusing calling everything answer.
renzlorenzz
13 Feb 2017, 12:47Oooh, thank you very much. it works really well
Siddone
25 Feb 2017, 12:35can you show how it is the right version, the one that works? thank you!
renzlorenzz
28 Feb 2017, 14:40[[first]]:
Type your line here
</input type="text" id="alpha" pattern="A-Za-z" maxlength="1"/>
[[submit]]
[[submit]]:
squiffy.set("textline", jQuery("#alpha").val());
You type {textline} the textarea on the first section...
{if textline=t:yes you got it right} {else: you got it wrong}