JavaScript For Kids For Dummies

Chapter 13

Creating a Wish List Program

The JavaScript genie came to us and told us that we can have not three, but unlimited, wishes if we just use arrays and functions to build a Wish List application. It seemed like quite a deal to us, until the genie reminded us that wishing doesn’t make it true. There’s always a catch! In this chapter, we show you how you can build a Wish List application.

Introducing the Wish List Program

The Wish List application uses an HTML form to accept input from a user, which it adds to an array and to an HTML list. A Print button allows a user to create a nicely formatted and sorted list that she can print out and deliver to the genie of her choice.

Viewing the finished program

To get an idea of how the finished Wish List program will look and function, follow these steps:

1. Open our Public Dashboard in JSFiddle.net by going to http://jsfiddle.net/user/forkids/fiddles.

2. Find the program named “Chapter 13 – Wish List – Finished” and click the title to open it.

   You should see the finished Wish List program, as shown in Figure 13-1.

3. Enter something into the HTML input field — World Peace, for example — and click the Add It button.

   The item you entered will be added as a list item and removed from the input field.

4. Add a few more items to your list.

   When you get to about five or six items, move on to the next step.

5. Click the Print Your List ...