Hello,

I received the following feed back regarding my code below and need help to adjust the code to fix these items please. My HTML and JavaScript code is below that I need to update to address these items. Feedback items that need to be fixed in the code below are:

1) You did Add an input field that allows the user to input the number of volunteers, but the content of this fields get displayed as if it were a person's name.

2) Additionally, each person should have her or his own input fields which your form does not do

3) You did Use JavaScript to display volunteer input fields based upon the number of volunteers entered, but no separate input fields for each person.

4) You did Store form data into an array of records, but not separately for each person.

5) You did Loop through the array of records to display the invitation message for each volunteer, but each person should get her/his own separate fields.

Original Assignment Instructions:

In the previous assessment, you used a static set of named variables to store the data that was entered in a form to be output in a message. For this assessment, you will use the invitation.html file that you modified in the previous assessment to create a more effective process for entering information and creating invitations for volunteers. Rather than having to enter each volunteer and create an invitation one at a time, you will create a script that will prompt the user to enter in the number of volunteers, event date, organization name, and host name. Using the number of volunteers entered (510), the script should loop through to ask the user to enter the recipient name and store it in an array. Once the user has entered all of the names and pressed submit, the page should display each of the invitations one after another at the bottom of the page. Directions Use the invitation.html file that you submitted in your previous assessment to add functionality to your form. This new functionality should allow the user to enter in the number of volunteers, whereupon the form will display the corresponding number of input fields for the user to enter information for each volunteer. Once the form is submitted, the data should be stored in an array to be looped through to create separate invitations for each volunteer on a new page. Make sure to do the following: Add an input field that allows the user to input the number of volunteers as a numeric value. Once the number of volunteers has been entered (by pressing the enter key while the cursor is in the input field), use JavaScript to display the volunteer input fields based upon the number of volunteers entered. Write JavaScript that stores the form into an array of records once the form is submitted. Write JavaScript to Loop through the array of records and then display the invitation message for each volunteer. (Unlike a simple array that contains a single variable for each index, an array of records allows us to store related data fields for each index in the array. If we were going to store this in simple arrays, we would need a separate array for each data field.) Once completed, view your pages in each of your two selected Web browsers to see if the content renders appropriately and consistently within each. Next, verify that your code is error-free using the appropriate browser-specific development tool found in the Resources. Take a screen capture of each of your validation results and save it for submission.

HTMLCode:

CapellaVolunteers.org

• Home
• Invitation
• Gallery
• Registration

Number of Recipients: Organization name: Event Date: URL: Host name:

Hello recipientName!

You have been invited to volunteer for an event held by organizationName on eventDate. Please come to the following website: websiteURL to sign up as a volunteer.

Thanks!

hostName

This events site is for IT-FP3215 tasks.

Javascript:

function create_invitation() //Function to replace placeholders in invitation { // Variable RecipientName to store value of recipientName from form var RecipientName = document.getElementById("recipientName_form").value; document.getElementById("recipientName").innerHTML= RecipientName ;

// Variable OrganizationName to store value of organizationName from form var OrganizationName= document.getElementById("organizationName_form").value; document.getElementById("organizationName").innerHTML= OrganizationName ;

// Variable EventDate to store value of eventDate from form var EventDate = document.getElementById("eventDate_form").value; document.getElementById("eventDate").innerHTML= EventDate ;

// Variable WebsiteURL to store value of websiteURL from form var WebsiteURL = document.getElementById("websiteURL_form").value; document.getElementById("websiteURL").innerHTML= WebsiteURL ;

// Variable HostName to store value of hostName from form var HostName = document.getElementById("hostName_form").value; document.getElementById("hostName").innerHTML= HostName ;

return false; } function UserInput() //Function to declare variables that store the input field data. { //Variable RecipientName to store the input field data(value). var RecipientName = document.getElementById("RecipientName"); alert(RecipientName); //Variable OrganizationName to store the input field data(value). var OrganizationName = document.getElementById("OrganizationName"); alert(OrganizationName); //Variable EventDate to store the input field data(value). var EventDate = document.getElementById("EventDate"); alert(EventDate); //Variable WebsiteURL to store the input field data(value). var WebsiteURL = document.getElementById("WebsiteURL"); alert(WebsiteURL); //Variable HostName to store the input field data(value). var HostName = document.getElementById("HostName"); alert(HostName); }

Thanks,

Annette