Hands-On Practice Case Study Task 1: The Website Folder. Create a folder called pacific14. Copy all...
Fantastic news! We've Found the answer you've been seeking!
Question:
Transcribed Image Text:
Hands-On Practice Case Study Task 1: The Website Folder. Create a folder called pacific14. Copy all of the files from your Chapter 9 pacific9 folder into the pacific14 folder. Task 2: Display an Alert Message on the Yurts Page. Launch a text editor and open the yurts.html file. You will configure the yurts.html page so that an alert message will pop up when the page is displayed in the browser. You have the option to complete this task with JavaScript or to complete this task with jQuery. Option 1: Using JavaScript. o Edit the body tag as follows: message. Save the file and test it in the browser. Your display should be similar to Figure 14.33. Figure 14.33 Pica Pacific Trails Resort Home Yurts Activities Reservations 8 The Yurts at Pacific Trails What is a yot? structures four A message displays when the Yurts page is loaded by the browser Figure 14.33 Full Alternative Text Option 2: Using JavaScript and jQuery. Modify the page as follows: Add a script tag in the head section to access a jQuery CDN. Code a jQuery script block that includes the ready event. Code JavaScript within the ready event to display an alert box with the message, "Today only-10% off on a weekend-coupon code ZenTen". Save the file and test it in the browser. Your display should be similar to Figure 14.33. Task 3: Add Form Data Validation to the Reservations Page. Launch a text editor and open the reservations.html file. You will configure form data validation for the Reservations page that requires an e-mail address to be entered. You have the option to complete this task with JavaScript or to complete this task with jQuery. Option 1: Using JavaScript. Add a script block to the head section as follows: function validateForm() { if (document.forms [0].myEmail.value == "") { alert("Please enter an e-mail address."); return false; } // end if return true; } // end function validateForm Edit the tag as follows: Save the file and load it in a browser. Test it by clicking the submit button without typing in the e-mail input box. The alert box should pop up and the form should not be submitted (see Figure 14.34). Test it again by entering information in the e-mail input box and submit again. The form should be submitted successfully and a confirmation page should appear. Figure 14.34 Pacific Trails Resort Home Yurts Activities Reservations Reservations at Pacific Trails Contact First Nam AD Comments The Reservations page indicates that an e-mail address was not entered Figure 14.34 Full Alternative Text Option 2: Using JavaScript and jQuery. Modify the page as follows: Add a script tag in the head section to access a jQuery CDN. Add a script tag in the head section to access the jQuery Validate plugin (refer to Hands-On Practice 14.13). Code a jQuery script block that includes the ready event and invokes the Validate plugin (refer to Hands-On Practice 14.13). o Edit the CSS to configure styles for error messages generated by the plugin. Configure a style rule for all label elements with the class name error. Use label.error as the selector. Set float to none, position to relative, left to 10em, top to -2.5em, width to 25em, color to red, and font typeface to Arial. o Edit the HTML. Remove the HTML5 required attributes. Remove the from the first name, last name, and comments labels. Add class="required email" to the input tag for the email textbox. Save the file and load it in a browser. Test it by clicking the submit button without typing anything in the form. Your page should be similar to Figure 14.35. Notice how the jQuery Validate plugin displayed an error message for the e-mail form control. Test the form again by entering information in form controls but enter an invalid e-mail address. Note the error message. Next, correct the e- mail address and click the submit button. The form should be submitted successfully and a confirmation page should appear. Figure 14.35 Pacific Tris Resort Reservatio X Pacific Trails Resort Home Yurts Activities Reservations Reservations at Pacific Trails Contact Us Required information is marked with an asterisk (*). First Name: Last Name: *E-mail: Phone: Arrival Date: Nights: Comments: Submit This field is required Figure 14.35 Full Alternative Text Copyright 2018 Pectie Tras Resort hefstomeudstme.com Form validation processed by a jQuery plugin 2 1 x III Hands-On Practice Case Study Task 1: The Website Folder. Create a folder called pacific14. Copy all of the files from your Chapter 9 pacific9 folder into the pacific14 folder. Task 2: Display an Alert Message on the Yurts Page. Launch a text editor and open the yurts.html file. You will configure the yurts.html page so that an alert message will pop up when the page is displayed in the browser. You have the option to complete this task with JavaScript or to complete this task with jQuery. Option 1: Using JavaScript. o Edit the body tag as follows: message. Save the file and test it in the browser. Your display should be similar to Figure 14.33. Figure 14.33 Pica Pacific Trails Resort Home Yurts Activities Reservations 8 The Yurts at Pacific Trails What is a yot? structures four A message displays when the Yurts page is loaded by the browser Figure 14.33 Full Alternative Text Option 2: Using JavaScript and jQuery. Modify the page as follows: Add a script tag in the head section to access a jQuery CDN. Code a jQuery script block that includes the ready event. Code JavaScript within the ready event to display an alert box with the message, "Today only-10% off on a weekend-coupon code ZenTen". Save the file and test it in the browser. Your display should be similar to Figure 14.33. Task 3: Add Form Data Validation to the Reservations Page. Launch a text editor and open the reservations.html file. You will configure form data validation for the Reservations page that requires an e-mail address to be entered. You have the option to complete this task with JavaScript or to complete this task with jQuery. Option 1: Using JavaScript. Add a script block to the head section as follows: function validateForm() { if (document.forms [0].myEmail.value == "") { alert("Please enter an e-mail address."); return false; } // end if return true; } // end function validateForm Edit the tag as follows: Save the file and load it in a browser. Test it by clicking the submit button without typing in the e-mail input box. The alert box should pop up and the form should not be submitted (see Figure 14.34). Test it again by entering information in the e-mail input box and submit again. The form should be submitted successfully and a confirmation page should appear. Figure 14.34 Pacific Trails Resort Home Yurts Activities Reservations Reservations at Pacific Trails Contact First Nam AD Comments The Reservations page indicates that an e-mail address was not entered Figure 14.34 Full Alternative Text Option 2: Using JavaScript and jQuery. Modify the page as follows: Add a script tag in the head section to access a jQuery CDN. Add a script tag in the head section to access the jQuery Validate plugin (refer to Hands-On Practice 14.13). Code a jQuery script block that includes the ready event and invokes the Validate plugin (refer to Hands-On Practice 14.13). o Edit the CSS to configure styles for error messages generated by the plugin. Configure a style rule for all label elements with the class name error. Use label.error as the selector. Set float to none, position to relative, left to 10em, top to -2.5em, width to 25em, color to red, and font typeface to Arial. o Edit the HTML. Remove the HTML5 required attributes. Remove the from the first name, last name, and comments labels. Add class="required email" to the input tag for the email textbox. Save the file and load it in a browser. Test it by clicking the submit button without typing anything in the form. Your page should be similar to Figure 14.35. Notice how the jQuery Validate plugin displayed an error message for the e-mail form control. Test the form again by entering information in form controls but enter an invalid e-mail address. Note the error message. Next, correct the e- mail address and click the submit button. The form should be submitted successfully and a confirmation page should appear. Figure 14.35 Pacific Tris Resort Reservatio X Pacific Trails Resort Home Yurts Activities Reservations Reservations at Pacific Trails Contact Us Required information is marked with an asterisk (*). First Name: Last Name: *E-mail: Phone: Arrival Date: Nights: Comments: Submit This field is required Figure 14.35 Full Alternative Text Copyright 2018 Pectie Tras Resort hefstomeudstme.com Form validation processed by a jQuery plugin 2 1 x III
Expert Answer:
Answer rating: 100% (QA)
It seems that you are working on a handson practice case study that involves creating and modifying web pages with JavaScript and jQuery The tasks inv... View the full answer
Related Book For
Integrated Accounting
ISBN: 978-1285462721
8th edition
Authors: Dale A. Klooster, Warren Allen, Glenn Owen
Posted Date:
Students also viewed these programming questions
-
how can i search for similar problems like befote the update?
-
You are required to provide a written report with evidence attached that proves you have identified and evaluated the food preferences of customer groups with differing characteristics so you can use...
-
Planning is one of the most important management functions in any business. A front office managers first step in planning should involve determine the departments goals. Planning also includes...
-
Need assistance on adding accounting info to the excel worksheet posted. A.) would 97,400 go under cash or fixed assets ? Number Styles Cells Editing Ideas g Cash Balance B. C D E H. K M T. 0,1,F...
-
At a point upstream of the throat of a converging-diverging nozzle, the properties are V1 = 200 m/s, T1 = 300 K, and p1 = 125 kPa. If the exit flow is supersonic, compute, from isentropic theory, (a)...
-
The world line of a particle is described by the equations x(t) = at + b sin t, y(t) = b cos t, z(t) = 0, |b| < 1, In some inertial frame describe the motion and compute the components of the...
-
In Example 22.5, derive Eqs. (22.9)-(22.11). Data From Example 22.5:- Equation 22.9 and 22.11:- Figure 22.8 shows an isothermal batch reactor in which the irreversible reactions A B C take place with...
-
David Talbot randomly selected securities from all those listed on the New York Stock Exchange for his portfolio. He began with a single security and added securities one by one until a total of 20...
-
ABC; product profitability Outerwear Inc. is concerned about the profitability of its regular gloves. Company managers are considering producing only the top-quality, fleece lined, gloves. The...
-
The proposed rates were not in the range the CEO expected given the pricing analysis. The CEO has asked the pricing actuary to verify the total projected loss cost excluding potential large storm...
-
4. The probability that the x-velocity component of particles in a gas lie in the range V to (v and dv) is P[vx|dvx = A-mv/2kB dux where A = 1/2 m (2TKUT). (i) Explain (without proof) how this result...
-
Who is Michael Hastings? Why is he considered to be a legitimate spokesperson for CSR?
-
How would the Seagrams Building fountain transform into snowflakes? sentimental dissolves and old-fashioned trick shots-the Seagram Building fountains dissolve into snowflakes, I enter a revolving...
-
where and C = SoN(d+) - Ke-T N(d_), d+ = The celebrated Black-Schole formula for European call option is N (x) log (So/K) + (r +o/2)T ovT = d_ = 1 e-y/2 dy. 2 J- In the above formula So is the...
-
what is capital market (stocks and bonds) problems in Egypt and what is the solution of this problems?
-
Why does the transaction did not appear on the REA diagram?
-
Let max (a, b) denote the maximum of two real numbers a and b. Which of the following statement(s) is/are TRUE about the function f(x)= max(3 - x, x - 1}? (a) It is continuous on its domain. (b) It...
-
A condenser (heat exchanger) brings 1 kg/s water flow at 10 kPa quality 95% to saturated liquid at 10 kPa, as shown in Fig. P4.91. The cooling is done by lake water at 20C that returns to the lake at...
-
What is the definition of accounting?
-
Write the answers to the following questions in the space provided. What is the result of using the calculator to find 3% of $6,589.00?
-
How can a company improve its working capital?
-
Many factors affect the economics of sport. What are some not discussed in the chapter? How do they affect financial management within the industry?
-
What is financial management? How does financial management differ in the sport industry as compared to other industries?
-
Which has the greater impact on financial management: the structure of a league or the structure of a team?
Study smarter with the SolutionInn App