Question

In: Computer Science

Examine the following code, which contains six common bugs. In a separate Microsoft Word (or other...

Examine the following code, which contains six common bugs. In a separate Microsoft Word (or other word processing or text file), identify the line number of at least three (3) bugs as well as a brief description of each bug. 1. 2.

1. <!DOCTYPE html>

2. </html>

3. <head> <link rel="stylesheet" href="MyStyle.css"> </head>

4. <body>

5. <nav>

6. <a href="GroceryHome.html">Home</a> |

7. <a href="Products.html">Products</a> |

8. <a href="AboutUs.html">About Us</a> |

9. <a href="Contact.html">Contact</a>

10. </nav>

11. <header>

12. <h1> My Contact Page</h1>

13. </header>

14. <article>

15. Thank you for your interest in our grocery store. We offer delivery or call-ahead pickup services.

Please provide your contact information, and indicate your family's food preferences.

16. </article> <p>

17. <form action="#" method="post" id="form1">

18. <div class="div1">

19. <label for="fname1" >First Name:</label><br>

20. <input type="text" name="firstname1" id="fname1"><br>

21. <label for="lname1" >Last Name:</label><br>

22. <input type="text" name="lastname1" id="lname1"><br>

23. <label for="phone1" >Phone (i.e. 123-456-7890):</label><br>

24. <input type="text" name="phone1" id="phone1" placeholder="123-456-7890" ><br>

25. <label for="email1" >Email:</label><br>

26. <input type="text" name="email1" id="email1" placeholder="abc@xyz"><br>

27. <label for="contactpreference1" >Prefered contact method?</label><br>

28. <input type="radio" name="contactpreference1" value="phone" checked> Phone

29. <input type="radio" name="contactpreference1" value="email"> Email

30. <br><br>

31. <input type="submit" id="Submit1" value="Submit" onclick=" validateMyPage()" />

32. </div>

33. </form>

34. <form action="#" method="post" id="form2" >

35. <div class="div2">

36. <label for="fname2" >First Name:</label><br>

37. <input type="text" name="firstname2 id="fname2" required><br>

38. <label for="lname2" >Last Name:</label><br>

39. <input type="text" name="lastname2" id="lname2" required><br>

40. <label for="phone2" >Phone (i.e. 123-456-7890):</label><br>

41. <input type="tel" name="phone2" id="phone2" placeholder="123-456-7890" pattern='\d{3}[\-

]\d{3}[\-]\d{4}' required><br>

42. <label for="email2" >Email:</label><br>

43. <input type="email" name="email2" id="email2" placeholder="[email protected]" required><br>

44. <label for="contactpreference2" >Prefered contact method?</label><br>

45. <input type="radio" name="contactpreference2" value="phone" checked> Phone

46. <input type="radio" name="contactpreference2" value="email"> Email

47. <br><br>

48. <input type="submit" id="Submit2" value="Submit" />

49. </div>

50. <br><br>

51. <div class="myColumns ">

52. <select id="mySiteColor" onChange="changeColor(this.value)">

53. <option value="">-- Select a color --</option>

54. <option value="blue">Blue</option>

55. <option value="yellow">Yellow</option>

56. <option value="red">Red</option>

57. </select>

58. </div>

59. </form>

60. <script>

61. function validateMyPage() {

62. var firstname1 = document.getElementById("fname1").value;

63. if (firstname1 != "") {

64. alert("Please enter a first name.");

65. }

66. else {

67. alert(firstname1);

68. }

69. var phone1 = document.getElementById("phone1").value;

70. if (phone1 == "") {

71. alert("Please enter a phone number.");

72. return false;

73. }

74. else

75. {

76. var rePhone = new RegExp(/\d{3}[\-]\d{3}[\-]\d{4}/);

77. var reResult = rePhone.test(phone1);

78. if (reResult == false)

79. {

80. alert("Please provide a valid phone number in the format of: 222-222-2222.");

81. return false;

82. }

83. else

84. {

85. alert(phone1);

86. }

87. }

88. var email1 = document.getElementById("email1")!value;

89. if (email1 == "") {

90. alert("Please enter an email address.");

91. return false;

92. }

93. else

94. {

95. var reEmail = new RegExp(/[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$/);

96. var reResult == reEmail.test(email1);

97. if (reResult == false)

98. {

99. alert("Please provide a valid email address.");

100. return false;

101. }

102. else

103. {

104. alert(“email1”);

105. }

106. }

107. alert("Form data validated by JavaScript successfully!");

108. }

109. function changeColor(value) {

a. var myColor = document.getElementById("mySiteColor").value;

b. document.body.style.color = value;

110. }

111. </script>

112. </body>

113. </html>

Solutions

Expert Solution

Bug1: on line 37 " are missing for name="fname2"

we always write the name value in between single or double quotes

Bug2: on line 88 unexpected ! we have to use . there

we always fetch a value using id we use.

  var email1 = document.getElementById("email1").value; this is the correct way

Bug3: unexpected == on line 96

we always asign value using a single equals

But here you used ==

correct statement is var reResult = reEmail.test(email1);

Bug4;  on line 104

syntax error some special characters are in alert

if we need to alert email1 variable we have not to use any quotes

then correct syntax is alert(email1);

Bug5:

on line 109

there is

a. var myColor = document.getElementById("mySiteColor").value;

b. document.body.style.color = value;

here we cannot declare variable as a.var

and we cannot apply style as b.document.body.style color= calue

undefined a and b

Bug6

on line 63 wrong if condition for validation

here we have to use firstname1 == ""

then gives the correct alert message

The modified code is:

<!DOCTYPE html>

</html>

<head> <link rel="stylesheet" href="MyStyle.css"> </head>
<body>
<nav>

<a href="GroceryHome.html">Home</a>
<a href="Products.html">Products</a>

<a href="AboutUs.html">About Us</a> |

<a href="Contact.html">Contact</a>

</nav>

<header>

<h1> My Contact Page</h1>

</header>

<article>

Thank you for your interest in our grocery store. We offer delivery or call-ahead pickup services.

Please provide your contact information, and indicate your family's food preferences.
</article> <p>

<form action="#" method="post" id="form1">
<div class="div1">
<label for="fname1" >First Name:</label><br>
<input type="text" name="firstname1" id="fname1"><br>
<label for="lname1" >Last Name:</label><br>

<input type="text" name="lastname1" id="lname1"><br>

<label for="phone1" >Phone (i.e. 123-456-7890):</label><br>

<input type="text" name="phone1" id="phone1" placeholder="123-456-7890" ><br>

<label for="email1" >Email:</label><br>

<input type="text" name="email1" id="email1" placeholder="abc@xyz"><br>

<label for="contactpreference1" >Prefered contact method?</label><br>

<input type="radio" name="contactpreference1" value="phone" checked> Phone

<input type="radio" name="contactpreference1" value="email"> Email

<br><br>

<input type="submit" id="Submit1" value="Submit" onclick=" validateMyPage()" />

</div>

</form>

<form action="#" method="post" id="form2" >

<div class="div2">

<label for="fname2" >First Name:</label><br>

<input type="text" name="firstname2" id="fname2" required><br>

<label for="lname2" >Last Name:</label><br>

<input type="text" name="lastname2" id="lname2" required><br>

<label for="phone2" >Phone (i.e. 123-456-7890):</label><br>

<input type="tel" name="phone2" id="phone2" placeholder="123-456-7890" pattern='\d{3}[\-

]\d{3}[\-]\d{4}' required><br>

<label for="email2" >Email:</label><br>

<input type="email" name="email2" id="email2" placeholder="[email protected]" required><br>

<label for="contactpreference2" >Prefered contact method?</label><br>
<input type="radio" name="contactpreference2" value="phone" checked> Phone
<input type="radio" name="contactpreference2" value="email"> Email
<br><br>
<input type="submit" id="Submit2" value="Submit" />
</div>

<br><br>

<div class="myColumns ">

<select id="mySiteColor" onChange="changeColor(this.value)">

<option value="">-- Select a color --</option>

<option value="blue">Blue</option>

<option value="yellow">Yellow</option>

<option value="red">Red</option>

</select>

</div>

</form>

<script>

function validateMyPage() {

var firstname1 = document.getElementById("fname1").value;
if (firstname1 == "") {

alert("Please enter a first name.");

}

else {

alert(firstname1);

}

var phone1 = document.getElementById("phone1").value;

if (phone1 == "") {

alert("Please enter a phone number.");

return false;

}

else

{

var rePhone = new RegExp(/\d{3}[\-]\d{3}[\-]\d{4}/);

var reResult = rePhone.test(phone1);

if (reResult == false)

{

alert("Please provide a valid phone number in the format of: 222-222-2222.");

return false;

}

else

{

alert(phone1);

}

}

var email1 = document.getElementById("email1").value;

if (email1 == "") {

alert("Please enter an email address.");

return false;

}

else

{
var reEmail = new RegExp(/[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$/);

var reResult =reEmail.test(email1);

if (reResult == false)

{

alert("Please provide a valid email address.");

return false;

}

else

{

alert(email1);

}

}

alert("Form data validated by JavaScript successfully!");

}

function changeColor(value) {

var myColor = document.getElementById("mySiteColor").value;

document.body.style.color = value;

}

</script>

</body>

</html>

IF any queries regarding bugs comment please


Related Solutions

Answer the following questions based . Write your response in a separate Microsoft Word document: o...
Answer the following questions based . Write your response in a separate Microsoft Word document: o Importance of Cost of Capital: THE ANSWER SHOULD BE BASED ON AMAZON Why is cost of capital important to an organization, and what does it measure? o Meaning of Calculations: How do organizations calculate various costs, and what do these calculations mean to business?
Microsoft leases rights to Microsoft Word, Excel, Powerpoint and other software applications to NJCU School of...
Microsoft leases rights to Microsoft Word, Excel, Powerpoint and other software applications to NJCU School of Business, Campus Administration for 14 annual payments of $8,500 at the beginning of each year. The payments will begin five years from today. If the market rate of interest is 8%, what is the present value of the payments? Provide the answer in Excel with formula please
Professionalism in Healthcare In a separate 6- to 7-page Microsoft Word document make sure to address...
Professionalism in Healthcare In a separate 6- to 7-page Microsoft Word document make sure to address these points and in APA format. Include 7-8 APA citations from scholarly sources; 1.            Discuss why professionalism is important for workers, patients, and healthcare employers? 2.            What does it mean to be a professional? What is the difference between nonprofessional and unprofessional? 3.            Why is developing a professional reputation based more on a person’s attitudes and behaviors than on his or her educational background,...
create a document in microsoft word or excel document which has the following: Fictitious names and...
create a document in microsoft word or excel document which has the following: Fictitious names and addresses of 10 folks including name, address and phone number. Recreate the bike table, which includes bike name, part number and hourly rate Please limit your submission to no more than 2 pages.
In this python script find any bugs and errors which would cause the code to crash....
In this python script find any bugs and errors which would cause the code to crash. The code must be re-written correctly. After debugging make a separate list of all the errors you found in the script. contacts_list=[] # global variable, list of contacts_list, one string per contact def pause()     """ pauses program e.g. to view data or message """     input("press enter to continue") def load():     """ populate list with data """          contacts_list.append(('Milo ', '063847489373'))...
2. In a Microsoft Word document, respond to the following: Recently, on the news there was...
2. In a Microsoft Word document, respond to the following: Recently, on the news there was a story about how a local city found itself in quite a financial bind due to the contracts the mayor had signed with the employees union. The contracts were so generous that it left the city with very little money for other things, like parks and festivals. Unfortunately, this type of agency problem is not unique. We see similar problems when school boards agree...
Chemical cold packs contain two separate compartments: one contains water and the other contains NH4NO3 (ammonium...
Chemical cold packs contain two separate compartments: one contains water and the other contains NH4NO3 (ammonium nitrate). When the contents of the two compartments combine, the temperature drops to approximately 0°C. A) Is the solvation process exothermic or endothermic? What does that tell us about the sign of DH? B) Is the solvation reaction spontaneous? What does that mean about the sign of DG? C) Since DG = DH - TDS, what do we know about the sign of DS?
Please answer in microsoft word How does the US Central Bank compare to other Central Banks?
Please answer in microsoft word How does the US Central Bank compare to other Central Banks?
QUESTION 7 - 6.3 I dislike using Microsoft Word and prefer to use other work processing...
QUESTION 7 - 6.3 I dislike using Microsoft Word and prefer to use other work processing software. However, nearly everyone that I work with uses Word, so I have to use this product when writing articles, books, and other research reports. For this reason, Microsoft Word holds a near-monopoly position in the word processor market. What is the barrier to entry that helps Microsoft maintain their market power? Network externalities Input barrier Barrier created by the government Economies of scale...
Using the table function in a Microsoft Word Document, create a table which compares and contrasts...
Using the table function in a Microsoft Word Document, create a table which compares and contrasts the following payments systems: 1. RBRVS 2. RUG’S 3. APC’s Include in your comparison include at least the following elements Classification system(s) used (ICD-10-CM, ICD-10-PCS, CPT, etc.) Health care setting (Inpatient, outpatient, physician office, etc.). Examples of who uses the payment system (Medicare, Medicaid, commercial payers, etc.) Examples of data that is required for the payment system (principle diagnosis, principle procedure, discharge disposition, etc.)
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT