Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Create two HTML pages, one containing a form and one set up to use the data submitted on the form. Use a CSS file for

Create two HTML pages, one containing a form and one set up to use the data submitted on the form. Use a CSS file for formatting.

On both HTML pages use the correct doctype, , , <head>, and <body> tags. Also use div tags defined in the CSS file to create a fixed width page wither header, main, and footer sections.</p> <p>The first HTM page should contain a form allowing the user to place an order and should have the following features:</p> <p>Input fields for:</p> <p>First Name</p> <p>Last Name</p> <p>A 2 line street address</p> <p>City</p> <p>State</p> <p>Zip</p> <p>Phone number</p> <p>Product ordered</p> <p>Quantity</p> <p>Price</p> <p>Use fieldset and legend tags to group the persons information separate from the product ordered information.</p> <p>Use div tags to group corresponding label and input tags.</p> <p>The second HTML page should be used to receive the information from the form. On the second page include:</p> <p>The GetParams function from the readings to convert the data string into separate variables.</p> <p>A thank you to the customer displaying the mailing information that will be used for the order.</p> <p>Display the order that was taken and multiply the price by the quantity to display the total.</p> <p>If the person orders a quantity of greater than 10, give them a 10% discount and display the discounted total.</p> <p>Once the form is working, modify it to include the following features:</p> <p>Use the autofocus attribute with the first name input element.</p> <p>Use the required and placeholder attributes with the first name and last name elements.</p> <p>Add an input element of type email to collect email address.</p> <p>Add an input element of type tel to collect the customers telephone number.</p> <p>Change the element type of quantity to number.</p> <p>Add an input element of type date to collect the requested delivery date.</p> <p>Include the new input elements on the receive page.</p> <p> </p> <p>Zip the three files and submit on moodle.</p> </div> </section> <section class="answerHolder"> <div class="answerHolderHeader"> <div class="answer-heading"> <h2>Step by Step Solution</h2> </div> <div class="answerReviews"> <div class="starReview"> <div class="starIcon"> </div> <div class="starText"> </div> </div> </div> </div> <div class="answerSteps"> <p>There are <span>3</span> Steps involved in it</p> <div class="step"> <h3>Step: 1</h3> <img src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/document_product_info/blur-text-image.webp" width="759" height="271" alt="blur-text-image" loading="lazy" decoding="async" fetchpriority="low"> <div class="step1Popup"> <h3>Get Instant Access to Expert-Tailored Solutions</h3> <p>See step-by-step solutions with expert insights and AI powered tools for academic success</p> <button class="view_solution_btn step1PopupButton">View Solution</button> </div> </div> <div class="step"> <h3 class="accordion">Step: 2</h3> <div class="panel"> <img src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/document_product_info/blur-subtext-image.webp" width="975" height="120" alt="blur-text-image" loading="lazy" decoding="async" fetchpriority="low"> <button class="view_solution_btn stepPopupButton">Sign Up to view</button> </div> </div> <div class="step"> <h3 class="accordion">Step: 3</h3> <div class="panel"> <img src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/document_product_info/blur-subtext-image.webp" width="975" height="120" alt="blur-text-image" loading="lazy" decoding="async" fetchpriority="low"> <button class="view_solution_btn stepPopupButton">Sign Up to view</button> </div> </div> </div> </section> </div> <div class="expertRight"> <section class="AIRedirect"> <div class="AIHolder"> <h2>Ace Your Homework with AI</h2> <p>Get the answers you need in no time with our AI-driven, step-by-step assistance</p> <a class="AILink" href="/ask_ai">Get Started</a> </div> </section> <section class="relatedBook"> <div class="bookHolder" > <div class="relatedBookHeading" > <h2>Recommended Textbook for</h2> <object class="freeTagImage" type="image/svg+xml" data="https://dsd5zvtm8ll6.cloudfront.net/includes/images/rewamp/document_product_info/free.svg" name="free-book-icon"></object> </div> <div class="bookMainInfo" > <div class="bookImage" > <a href="/textbooks/main-memory-database-systems-1st-edition-9781680833249"> <img src="https://dsd5zvtm8ll6.cloudfront.net/si.question.images/book_images/64ed89ecd4105_47830.jpg" width="100" height="131" alt="Main Memory Database Systems" loading="lazy"> </a> </div> <div class="bookInfo" > <h3 class="bookTitle"> <a href="/textbooks/main-memory-database-systems-1st-edition-9781680833249"> Main Memory Database Systems </a> </h3> <div class="bookMetaInfo" > <p class="bookAuthor"> <b>Authors:</b> <span>Frans Faerber, Alfons Kemper, Per-Åke Alfons</span> </p> <p class="bookEdition"> 1st Edition </p> <p class="bookEdition"> 1680833243, 978-1680833249 </p> </div></div></div> <a href="/textbooks/computer-science-vue-js-framework-2752" class="viewMoreBooks">More Books</a> </div> </section> </div> </div> <section class="relatedQuestion"> <div class="relatedQuestionHolder"> <h4>Students also viewed these Databases questions</h4> <div class="relatedQuestionSliderHolder"> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> </div> <a class="relatedQuestionText" href="/study-help/research-methods-business/theory-is-important-for-hr-research-because-a-tutors-give-2106633" > Theory is important for HR research because: a Tutors give a bad mark if there is no theory. b Theory relates to know-about knowledge. c There is a general theory of HR. d Theories provide a basis... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/see-table-25-showing-financial-statement-data-and-stock-price-data-for-mydeco-corp" > See Table 2.5 showing financial statement data and stock price data for Mydeco Corp. Use the data from the balance sheet and cash flow statement in 2012 to determine the following: a. How much cash... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/this-question-is-based-on-networks-and-communication-can-someone-13169110" > This question is based on Networks and Communication. Can someone please solve this question. A small size start-up company owns 4 departments marketing, administrative, finance and customer service... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/practice-problem-1-part-level-submission-flint-corporation-was-organized-12884628" > Practice Problem 1 (Part Level Submission) Flint Corporation was organized on January 1, 2020. It is authorized to issue 14,000 shares of 8%, $100 par value preferred stock, and 514,000 shares of... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/while-on-roving-patrol-during-the-evening-shift-you-come-3314943" > While on roving patrol during the evening shift, you come across a vehicle that had veered off the road and struck a parked vehicle. When you approach the vehicle, you immediately recognize that the... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/1-determine-the-required-monthly-payments-for-the-mortgage-2-7382278" > 1. Determine the required monthly payments for the mortgage. 2. Determine the opportunity costs, on a monthly basis, of using the required funds for closing (i.e., down payment plus all closing... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/the-following-changes-took-place-last-year-in-pavolik-companys-8979649" > The following changes took place last year in Pavolik Company's balance sheet accounts: D= Decrease; I = Increase. Long-term investments that cost the company $12 were sold during the year for $28... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/entries-into-t-accounts-and-trial-balance-connie-young-an-10280073" > Entries into T accounts and Trial Balance Connie Young, an architect, opened an office on October 1, 20Y4. During the month, she completed the following transactions connected with her professional... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/questions/panera-bread-is-using-pestel-analysis-to-determine-opportunitiesthreats-facing-2928564" > Panera Bread is using PESTEL analysis to determine opportunities/threats facing them. Which of the following is an example of a threat facing Panera Bread, based on this analysis? Increasing levels... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/managing-human-behavior-in-public/1-what-is-the-public-service-mission-of-your-agency-2124396" > 1. What is the public service mission of your agency or organization (or the organization that you hope to work for)? How does the organization benefit the people it serves? Think of specific... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/managing-human-behavior-in-public/3-implement-the-action-steps-after-a-reasonable-time-period-2124395" > 3. Implement the action steps. After a reasonable time period, assess the results. Has your motivation increased? Has your interest, satisfaction, or performance improved? What else might you do to... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> <div class="relatedQuestionCart "> <div class="relatedQuestionCartHeader"> <h3>Question</h3> <div class="relatedStarRating"> <span class="star active">★</span><span class="star active">★</span><span class="star active">★</span><span class="star">★</span><span class="star">★</span> </div> </div> <a class="relatedQuestionText" href="/study-help/managing-human-behavior-in-public/2-discuss-the-practical-implications-for-each-of-the-models-2124389" > 2. Discuss the practical implications for each of the models you use. In other words, what do these models suggest the supervisor should do or say as a consequence of defining the problem from that... </a> <div class="relatedQuestionCartFooter"> <div class="relatedHistory"> <p> Answered: <span>1 week ago</span> </p> </div> </div> </div> </div> </div> </section> <hr class="expert-separator"> <div class="next-previous-button"> <div class="navigationButtons"> <a class="previousQuestionButton" href="/study-help/questions/so-im-supposed-to-write-python-code-that-implements-the-13169108">Previous Question</a> <a class="nextQuestionButton" href="/study-help/questions/this-question-is-based-on-networks-and-communication-can-someone-13169110">Next Question</a> </div> </div> </div> <div class="promo items-center justify-center hidden" style="margin-left:-15px;"> <div class="app_promo"> <div class="app_promo_headline"> <img class="app_promo_icon" alt="Mobile App Logo" width="40" height="40" loading="lazy" src="includes/images/mobile/finalLogo.png"> <p class="app_promo_title font-sans items-center">View Answer in SolutionInn App</p> </div> <button class="app_promo_action redirection question_open_url='q_id=13169109&q_type=2'"> Download on the App Store </button> <button class="btn btn-default app_promo_dismiss"> Continue with the mobile website </button> </div> </div> </main> </div> <div class="blank-portion"></div> <footer> <div class="container footerHolder"> <div class="footerLinksFlex"> <div class="footerLinksCol col-md-3 col-lg-3 col-sm-6 col-6"> <p>Services</p> <ul> <li><a href="/site-map">Sitemap</a></li> <li><a href="/fun/">Fun</a></li> <li><a href="/study-help/definitions">Definitions</a></li> <li><a href="/tutors/become-a-tutor">Become Tutor</a></li> <li><a href="/study-help/categories">Study Help Categories</a></li> <li><a href="/study-help/latest-questions">Recent Questions</a></li> <li><a href="/study-help/questions-and-answers">Expert Questions</a></li> </ul> </div> <div class="footerLinksCol col-md-3 col-lg-3 col-sm-6 col-6"> <p>Company Info</p> <ul> <li><a href="/security">Security</a></li> <li><a href="/copyrights">Copyrights</a></li> <li><a href="/privacy">Privacy Policy</a></li> <li><a href="/conditions">Terms & Conditions</a></li> <li><a href="/solutioninn-fee">SolutionInn Fee</a></li> <li><a href="/scholarships">Scholarship</a></li> </ul> </div> <div class="footerLinksCol col-md-3 col-lg-3 col-sm-6 col-6"> <p>Get In Touch</p> <ul> <li><a href="/about-us">About Us</a></li> <li><a href="/support">Contact Us</a></li> <li><a href="/career">Career</a></li> <li><a href="/jobs">Jobs</a></li> <li><a href="/support">FAQ</a></li> <li><a href="/campus-ambassador-program">Campus Ambassador</a></li> </ul> </div> <div class="footerLinksCol col-md-3 col-lg-3 col-sm-6 col-12"> <p>Secure Payment</p> <div class="footerAppDownloadRow"> <div class="downloadLinkHolder"> <img src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/rewamp/common/footer/secure_payment_method.png" class="img-fluid mb-3" width="243" height="28" alt="payment-verified-icon" loading="lazy"> </div> </div> <p>Download Our App</p> <div class="footerAppDownloadRow"> <div class="downloadLinkHolder mobileAppDownload col-md-6 col-lg-6 col-sm-6 col-6 redirection" data-id="1"> <img style="cursor:pointer;" src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/rewamp/home_page/google-play-svg.svg" alt="SolutionInn - Study Help App for Android" width="116" height="40" class="img-fluid mb-3 " loading="lazy"> </div> <div class="downloadLinkHolder mobileAppDownload col-md-6 col-lg-6 col-sm-6 col-6 redirection" data-id="2"> <img style="cursor:pointer;" src="https://dsd5zvtm8ll6.cloudfront.net/includes/images/rewamp/home_page/apple-store-download-icon.svg" alt="SolutionInn - Study Help App for iOS" width="116" height="40" class="img-fluid mb-3" loading="lazy"> </div> </div> </div> </div> </div> <div class="footer-bottom"> <p>© 2024 SolutionInn. All Rights Reserved</p> </div></footer> <script> window.addEventListener("load",function(){jQuery(document).ready(function(t){t.ajax({type:"POST",url:"/",data:{trackUserActivity:!0,reqUri:document.URL,referer:document.referrer},success:function(t){}})})},!1),window.addEventListener("load",function(){jQuery(document).ready(function(t){t.ajax({type:"POST",url:"/",data:{insertCrawler:!0,reqUri:document.URL,parseTime:"0.056",queryTime:"0.01654768548584",queryCount:"30"},success:function(t){}})})},!1),window.addEventListener("load",function(){jQuery(document).ready(function(){function t(t="",n=!1){var i="itms-apps://itunes.apple.com/app/id6462455425",e="openApp://action?"+t;isAndroid()?(setTimeout(function(){return window.location="market://details?id=com.solutioninn.studyhelp",!1},25),window.location=e):isIOS()?(setTimeout(function(){return window.location=i,!1},25),window.location=e):(i="https://apps.apple.com/in/app/id6462455425",n&&(i="https://play.google.com/store/apps/details?id=com.solutioninn.studyhelp"),window.open("about:blank","_blank").location.href=i)}jQuery("#appModal").modal("show"),jQuery(".download-app-btn").click(function(){t(jQuery(this).attr("question_open_url"))}),jQuery(".redirection").click(function(){var n=jQuery(this).attr("question_open_url"),i=jQuery(this).attr("data-id");void 0!=n?1==i?t(n,!0):t(n,!1):1==i?t("",!0):t("",!1)}),jQuery(".app-notification-close").click(function(){jQuery(".app-notification-section").css("visibility","hidden");var t=new FormData;t.append("hide_notification",!0),jQuery.ajax({type:"POST",url:"/",data:t,cache:!1,contentType:!1,processData:!1,beforeSend:function(){},success:function(t){location.reload()}})})})},!1); </script> </body> </html>