1

I'm interested in creating a fill-in-the-blank story generator for kids. I want to create a form where they can put in the names of characters and other things and have that data populate a pre made story. After they hit SUBMIT they would be taken to a follow up page with their input and the story in plain text. I'm pretty new to this but very eager to learn. What would be the best way to go about creating this form that generates stories?

Kara
  • 6,115
  • 16
  • 50
  • 57
Master
  • 13
  • 1
  • 3
  • How big are these stories (char count) and how many will there be? How do you plan to store them, are you also going to store the users' (kids) generated stories? – ılǝ Aug 29 '13 at 03:04
  • For starters there would be about 10 short stories of about 2500 characters each. I don't really plan on storing them, just populate the story with their input in text, so they can copy and paste it into a word processor or print it straight from the browser. – Master Aug 29 '13 at 12:07
  • @Ile Also, the form will just have simple input boxes like "name", "character one", "character two", "boy or girl" (this would probably be a radio button), "location". Lastly, they would choose a genre like sci-fi or action (this would be how the form knows which story template to grab). Once complete they would see the story. – Master Aug 29 '13 at 12:19
  • my answer below still stands and you can adjust it accordingly – ılǝ Aug 29 '13 at 13:32

1 Answers1

0

It seems you would need two database tables - one for storing the original story templates and another one for storing the generated texts. The challenging part with the template database is signifying the parts where there can be user input. One idea - place a special format code inside the text in the following manner:

Once upon a time, in a forest far away, lived ::00001::.

Assuming you are loading that template as it is in an element inside a form (I would avoid textfields for this purpose and just place the text).

After the text is loaded into the web page (javascript onload), replace your markers with input fields (I'd use jquery for that). You can use jquery to search an elements text/innerHtml and replace it with another html element. Here is an idea how to do that. The replacement of markers with inputs can be done in a javascript while loop, as long as there is "::" in the text of the element.

Then your ::00001:: could be replaced for example with:

< input type='text' id='input00001' name='input[00001]'/>

Then, when the user submits the form, you can get the values for each field and store them to a second database with the given ids. This way, you will be able to reload them later (same process, only instead of inputs, you would replace the codes with their corresponding values).

This way, in the second database table you only save the input values and not the whole text, to save up memory. Probably in the second table you would like to store the id of the field, the value, perhaps a template id (so that you know for which story template it corresponds) and a user id or at least a timestamp, in case you can have many generated stories for the same template.

Hope this helps!

Community
  • 1
  • 1
ılǝ
  • 3,440
  • 2
  • 33
  • 47