Answered step by step
Verified Expert Solution
Question
1 Approved Answer
Use only html, css, and javascript Create the Dating.html HTML page that implements the web display using JavaScript. The page must contain a drop-down box
Use only html, css, and javascript
- Create the Dating.html HTML page that implements the web display using JavaScript.
- The page must contain a drop-down box for selecting a gender (male, female, all, etc)
- When a gender is selected from the drop-down box, the page should update to display all of the users that match the selected gender.
- Display an image, title, name, age, profile description, city, state, status (single/taken), has kids (yes/no), wants kids (yes/no), religion, and type of relationship (long-term, short-term, friends, and casual).
- Include a Like button to allow the user to add the person to a list of people they liked and want to save. When the button is clicked, the page should display their current list of likes and update as items are added to it. If the user clicks Likes multiple times for an item, your program should not add multiple copies to the list. This button should not remove the person from the search results.
- Include a Pass button to allow the user to remove a person from the search results.
- The page should contain controls to allow the user to search for users that live in a specified state.
- The information used in the display should come from JavaScript objects stored in an array inside your page.
- Use JavaScript to implement the interactive behavior of the page.
- You will need about 20 user dating profiles for each of the main categories (male/female) and at least 5 for any additional categories you include. Also, you need an image for each person, which should be stored in an images folder.
- Create an array to store JavaScript objects that represent a users dating profile with all of its necessary data. The JavaScript object will contain the title, name, age, profile description, status, has kids, wants kids, religion, type of relationship, city, state, and the URL for the users image file.
- The selection of a gender category from the drop-down box should update the page to display the list of users that match the category along with their information.
- Implement the ability to allow the user to like other users. The users like list should change as new users are added to it. Also, you need to keep track of this list during the entire use of the page.
- Implement the ability to allow the user to remove a user from the list of search results.
- Allow the user to narrow the list of user profiles by searching and display all users that live in a specified state. The page should update to display the list of profiles that meet the criteria. For example, the user is currently viewing all women, but they only want to see women that live in New York; the search should change the pages results to display only the women that live in New York.
- The page should include the proper controls to allow the user to perform this search.
- The search should be performed on the array of JavaScript objects that contain all dating profiles.
- Display the list of Likes on the page that shows all the people the user liked and wanted to save as favorites during that session.
- The list of likes should contain a small profile summary (name, age, and profile description) with picture for each person in the display.
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started