ICT1512 Assignment 11 Hands-On Project 9-1

ICT1512 Assignment 11 Hands-On Project 9-1 solutions In this project you will work on a web page in which customers attach greeting messages to gifts purchased for friends and family. The contents of the greeting message will be entered on one web page form and then displayed as part of a shopping cart on a separate page. Data will be transferred from one page to the next by appending data to a query string. A preview of the shopping cart page with a sample gift card message is shown in Figure 9-22. Do the following: 1. Use your code editor to open the project09-01a_, project09-01b_, and project09-01b_ files from the js09 c project01 folder. Enter your name and the date in the comment section of each file and save them as project09- , , and , respectively. 2. Go to the file in your code editor. Edit the form element so that submitting the form opens the file using the get method. Close the file, saving your changes. 3. Go to the file in your code editor and add a script element linked to the file. Defer the loading of the script until the page finishes loading. Take some time to study the contents of the HTML file and then close the file, saving your changes. 4. Go to the file in your code editor. Apply the slice() method to the h object, storing the text after the first character in the query variable. 5. Use the replace() method to replace very occurrence of the + character in the query variable with a blank space. Apply the decodeURIComponent() method to replace every URI-encoded character in query with the matching character. 6. Appy the split() method to the query string to split the text at every occurrence of the & character, placing each name=value pair as a separate item in the cardFields array. 7. Create a for of loop that loops through every item in the cardFields array. At each iteration of the loop do the following: a. Split each item at the location of the = character, store the substrings in the nameValue array variable. b. Store the first item in the nameValue array in the name variable. Store the second item in the nameValue array in the value variable. c. Store the value of the value variable as the text content of the document element with an id equal to the name variable. 8. Save your changes to the file and then load in your web browser. Enter sample greeting text in the field of the web form and then click the Submit button. Verify that the browser opens the file with the text of the greeting message displayed in the page.