Question: NEED HELP! In this project you will use web storage to store information from a membership form of a cycling group. The membership information will
NEED HELP!
In this project you will use web storage to store information from a membership form of a cycling group. The membership information will be extracted from the form and saved to session storage. You will then confirm that the data has been saved and retrieve the data, displaying it within a second web page. Figure 9-23 shows a preview of membership data retrieved from session storage and presented within a web table.
Figure 9-23.
Completed Project 9-2
Do the following:
Use your code editor to open the project09-02a_txt.html, project09-02a_txt.js, project09-02b_txt.html, and project09-02b_txt.js files from the js09 project02 folder. Enter your name and the date in the comment section of each file and save them as project09-02a.html, project09-02a.js, project09-02b.html, and project09-02b.js, respectively.
Go to the project09-02a.html file in your code editor and add a script element linked to the project09-02a.js file. Defer the loading of the script until the page finishes loading. Study the contents of the file and then close it, saving your changes.
Go to the project09-02a.js file in your code editor. At the bottom of the file insert an onclick button that runs the showData() function when the Submit button is clicked.
Add the showData() function and within the function insert the following commands:
Insert a command to the store the value of the riderName object in a session storage object named riderName.
Repeat the previous step for the ageGroup, bikeOption, routeOption, accOption, region, miles, and comments objects.
Add a command that changes the value of the location.href object to the project09-02b.html file.
Close the file, saving your changes.
Go to the project09-02b.html file in your code editor and add a script element linked to the project09-02b.js file. As before, defer the loading of the script until the page loads. Review the contents of the file and then close it, saving your changes.
Go to the project09-02b.js file in your code editor. At the bottom of the file insert a command to retrieve the value of the riderName key from session storage and store that value in the text content of the riderName object in the web page.
Repeat Step 7 for the ageGroup, bikeOption, routeOption, accOption, region, miles, and comments keys.
Save your changes to the file and then load project09-02a.html in your web browser. Enter sample membership data in the web form and then click the Submit button. Verify that the project09-02b.html opens and that the membership information you entered is displayed in the web table.
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
