Today’s Objectives

Today’s Objectives Announcements Homework 2 is due next week at 7:00 p.m. Last day to drop or withdraw from a fall class is 27-Oct Team assignments for Homework #3 – Create an online book store web app with ASP.NET and C# The third homework assignment is a team project, and each team must have four members. Each team gets a group account on dcm Review midterm exam JavaScript (continued) Week 9

Midterm Exam Please return your exam papers today

Midterm Exam Question 9 Write the XHTML code for the following table. Write only the code for the table, not the code for an entire page. Hint: The table width is 240. <table border="1" width="240"> <tr> <td colspan="2">Sandwiches</td> </tr> <tr> <td>Ham and Swiss</td><td align="right">$7.99</td> </tr> <tr> <td>Gyro</td><td align="right">$7.99</td> </tr> </table>

Midterm Exam Question 11 Assuming that the files for your Web site are stored in the directories shown in the figure, write the XHTML code that you would put in the file named “deli.html” in order to display the image in “poorboy.jpg” that is 200 pixels wide by 100 pixels high. Hint: Remember to make the image accessible for screen readers. pages index.html HW2 deli.html menu.html images poorboy.jpg burger.jpg stylesheets deli.css scripts deli.js <img src="images/poorboy.jpg" height="100" width="200" alt="Poorboy"/>

Midterm Exam Question 21 Write the CSS rule that would appear in the external style sheet in order to display the text shown in the screen shot from the HTML source also shown above. Hint: The text font is Arial, italic, size 36. <span id="greeting">Hello</span> #greeting { font-family:Arial; font-style:italic; font-size:36; }

Midterm Exam Question 25 If “Charles Moen” is entered in the text field, as shown, and the form is submitted, what will be the URL submitted (including the query string, if any). <html> <body> <form method="get" action="welcome.aspx"> <input type="text" name="name"/> <br/> <input type="hidden" name="location" value="UHCL"/> <input type="submit"/> </form> </body> </html> http://dcm.uhcl.edu/moen/welcome.aspx?name=Charles+Moen&location=UHCL

Midterm Exam Question 29 Create an XML file that contains information about the textbook that we will use for this course during the second half of the semester. Your XML file must conform to the DTD. Hint: Your XML file must contain only the information specified by the DTD. <!ELEMENT booklist (book)+> <!ELEMENT book (title,author)> <!ATTLIST book yearpublished CDATA #REQUIRED> <!ELEMENT title (#PCDATA)> <!ELEMENT author (firstname,lastname)> <!ELEMENT firstname (#PCDATA)> <!ELEMENT lastname (#PCDATA)> MacDonald, Matthew. Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second Edition. Apress, 2007. ISBN 978-1-59059-891-7 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE booklist SYSTEM "booklist.dtd"> <booklist> <book yearpublished="2007"> <title>Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second Edition</title> <author> <firstname>Matthew</firstname> <lastname>MacDonald</lastname> </author> </book> </booklist>

Midterm Exam Question 32 The screen shot shows the output from a JavaScript function that calculates the user’s age on their birthday in the current year. In the space below, write a JavaScript function that calculates the age by using the birth year that is input by the user. Your function must get the birth year that was input by the user from the form, calculate their age on their birthday in the current year, and insert the result into the appropriate text field on the form, as shown in the screen shot. <input type="text" name="birth" id="birthid"/> <input type="text" name="age" id="ageid"/> var today = new Date(); var current_yyyy = today.getFullYear(); function calculateAge() { var birthyear = document.getElementById("birthid").value; var age = current_yyyy - birthyear; document.getElementById("ageid").value = age; }

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Calculator</title> <style type="text/css"> #error { color:red; } </style> <script type="text/javascript"> function compute() { var number = document.getElementById("numberid").value; if (!number.match(/^\d+$/)) { document.getElementById("error").innerHTML = "Please enter a number!"; document.getElementById("squareid").value = ""; document.getElementById("cubeid").value = ""; } else { document.getElementById("error").innerHTML = ""; document.getElementById("squareid").value = number * number; document.getElementById("cubeid").value = number * number * number; } } </script> </head> <body> <form method="get" action="#" onsubmit="compute();return false;"> <p> <label for="numberid">Enter an integer: </label><input type="text" name="number" id="numberid"/> <span id="error"></span> </p> <p> <input type="submit" value="Compute"/> </p> <p> <label for="squareid">Square: </label><input type="text" name="square" id="squareid"/> </p> <p> <label for="cubeid">Cube: </label><input type="text" name="cube" id="cubeid"/> </p> </form> </body> </html> Question 33

Progress Review

So far, we have learned… Basics Internet and the World Wide Web; URL; Web design evolution; Accessibility and usability; Web 2.0 HTML and XHTML HTML elements and markup tags; W3C validation; HTML forms CSS Stylesheets and properties XML Representing data with XML; Well-formedness; DTDs HTTP HTTP Request; Parameter passing JavaScript Core language; DOM; Regular expressions Client-side development – when and how to use these technologies Progress Review

Next… JavaScript Events and event handling DHTML Cookies HTTP Response Server-side development ASP.NET C# Sessions Database access with ADO Progress Review

Today’s Objectives