1. HTML, XHTML, and CSS Chapter 12 Creating and Using XML Documents

2. Chapter 12: Creating and Using XML Documents 2 Chapter Objectives Describe how XML differs from HTML Describe an XML document instance, and rules for creating a well-formed and valid XML document Define the purpose of the processing instruction, the document prolog, and the document instance Describe an XML Schema Definition (XSD) language file

3. Chapter 12: Creating and Using XML Documents 3 Chapter Objectives Create and bind an XSL style sheet file to an XML document Discuss the uses of an XML data island Discuss the built-in table element methods for displaying an XML document in a table Create a JavaScript user-defined function to search an XML document

4. Chapter 12: Creating and Using XML Documents 4 Starting Notepad++ and Creating a New XML Document Start Notepad++, and, if necessary, maximize the Notepad++ window. If the Word wrap feature is not enabled, enable it With the USB drive plugged into your computer, click File on the menu bar, and then click Save As on the File menu If necessary, navigate to the Chapter12\ChapterFiles folder on your storage device Type chapter12-1classic_books.xsd in the File name text box Click the Save button in the Save As dialog box to save the Schema Definition file

5. Chapter 12: Creating and Using XML Documents 5 Starting Notepad++ and Creating a New XML Document

6. Chapter 12: Creating and Using XML Documents 6 Entering the Code for the Prolog, Root, Annotation, and Documentation Elements Click line 1 Enter the XML code shown in Table 12–11 to create the beginning of the XML Schema Definition with the prolog, root, annotation, and documentation elements

7. Chapter 12: Creating and Using XML Documents 7 Entering the Code for the Prolog, Root, Annotation, and Documentation Elements

8. Entering Code for the Element Click line 10 and press the ENTER key once to place the insertion point on a blank line 11 Enter the XML code shown in Table 12–12 to add the classic_books element tags Press the ENTER key twice after line 17 Chapter 12: Creating and Using XML Documents 8

9. Entering Code for the Element Chapter 12: Creating and Using XML Documents 9

10. Entering Code for the Element If necessary, click line 19 Enter the XML code shown in Table 12–14 to enter the element to define the group elements Press the ENTER key twice after line 21 and position the insertion point at the beginning of line 23 Chapter 12: Creating and Using XML Documents 10

11. Entering Code for the Element Chapter 12: Creating and Using XML Documents 11

12. Chapter 12: Creating and Using XML Documents 12 Entering Code for the Child Group Elements If necessary, click line 23 Enter the XML code shown in Table 12–15 to enter the element to define the childElements, pressing the ENTER key once after line 32

13. Chapter 12: Creating and Using XML Documents 13 Entering Code for the Child Group Elements

14. Chapter 12: Creating and Using XML Documents 14 To Save and Validating the XML Schema Definition File With the USB drive plugged into your computer, click the Save icon on the Notepad++ toolbar to re-save the chapter12-1classic_ books.xsd file Close the chapter12- 1classic_books.xsd file, but don’t close Notepad++ Start your browser and type www.w3.org/2001/03/webdata/xsv in the Address box and press the ENTER key Scroll down to find the section that begins with “Use this form only if you are behind a firewall or have a schema to check which is not accessible via the Web”

15. Chapter 12: Creating and Using XML Documents 15 To Save and Validating the XML Schema Definition File Click the Browse button and navigate to your USB drive Double-click the chapter12-1classic_books.xsd file to select the XML Schema definition file for the validation Web page Click the Show warnings and Keep Going check boxes, but not the Check as complete schema check box Click the Upload and Get Results button. A valid XML Schema Definition will have no error messages

16. Chapter 12: Creating and Using XML Documents 16 To Save and Validating the XML Schema Definition File

17. Creating a New XML Document and Entering the Prolog Code If necessary, activate the Notepad++ window Click File on the menu bar, then click New to create a new Notepad++ document With the USB drive plugged into your computer, click File on the menu bar, and then click Save As on the File menu If necessary, navigate to the Chapter12\ChapterFiles folder on UDISK (G:) Chapter 12: Creating and Using XML Documents 17

18. Creating a New XML Document and Entering the Prolog Code Type chapter12-1classics.xml in the File name text box Click the Save button in the Save As dialog box If necessary, click line 1 Enter the XML code shown in Table 12–17 to create the prolog and press the ENTER key twice Chapter 12: Creating and Using XML Documents 18

19. Creating a New XML Document and Entering the Prolog Code Chapter 12: Creating and Using XML Documents 19

20. Starting Entering a Document Instance in an XML Document If necessary, click line 4 Enter the XML code shown in Table 12–19 to create the root and first document instance. Press the ENTER key after line 13 Chapter 12: Creating and Using XML Documents 20

21. Starting Entering a Document Instance in an XML Document Chapter 12: Creating and Using XML Documents 21

22. Finishing Entering a Document Instance in an XML Document If necessary, click line 14, indented as shown in Figure 12–15 Enter the XML code shown in Table 12–20 with the error on line 29 to finish creating the document instance and do not press the ENTER key Chapter 12: Creating and Using XML Documents 22

23. Finishing Entering a Document Instance in an XML Document Chapter 12: Creating and Using XML Documents 23

24. Saving and Testing an XML Document in a Browser With a USB drive plugged into your computer, click the Save Icon on the Notepad++ toolbar to save the completed chapter12-1classics.xml document Start your browser. If necessary, click the Maximize button Click the Address bar Type g:\Chapter12\ChapterFiles\chapter12- 1classics.xml and then press the ENTER key to display the completed document Chapter 12: Creating and Using XML Documents 24

25. Saving and Testing an XML Document in a Browser Chapter 12: Creating and Using XML Documents 25

26. Chapter 12: Creating and Using XML Documents 26 Correcting a Tag Error and Retesting the XML Document Click the Notepad++ button on the taskbar Click line 29 Delete the uppercase tag Type as the new tag in place of the deleted tag to correct the closing book tag Click the Save icon on the Notepad++ toolbar to save the corrected file Activate the browser

27. Correcting a Tag Error and Retesting the XML Document Click the Refresh button on the browser toolbar to display the corrected page If necessary, click the security bar under the tabs, and then click Allow Blocked Content on the shortcut menu If necessary, click Yes in the Security Warning dialog box Click the minus sign in front of the second tag to collapse the individual instance in the list Click the plus sign in front of the second tag to expand that instance Chapter 12: Creating and Using XML Documents 27

28. Chapter 12: Creating and Using XML Documents 28 Correcting a Tag Error and Retesting the XML Document

29. Chapter 12: Creating and Using XML Documents 29 Validating XML and XSD Files If necessary, activate your browser Click the Address bar Type tools.decisionsoft.com/schemaValidate/index.jsp and then press the ENTER key to load the Web page Click the Browse button next to the XML Schema text box Navigate to your storage device and locate the XML Schema Definition file, chapter12-1classic_books.xsd Click the Open button on the Choose File to Upload dialog box

30. Chapter 12: Creating and Using XML Documents 30 Validating XML and XSD Files Click the Browse button next to the XML Instance text box Navigate to your storage device and locate the XML document instance file, chapter12-1classics.xml Click the Open button on the Choose File to Upload dialog box Click the Validate button on the XML Schema Validator to upload the files When the Web page indicates the XML instance and XML schema are present, click the Click here link to see the results

31. Chapter 12: Creating and Using XML Documents 31 Validating XML and XSD Files

32. Chapter 12: Creating and Using XML Documents 32 Opening an XML Document and Saving It with a New Name Click the Notepad++ button on the status bar to activate the Notepad++ window With the USB drive plugged into your computer, click File on the menu bar, and then click Open on the File menu If necessary, navigate to the Chapter12\ChapterFiles folder on the USB drive. Click All types (*,*) in the Save as type: drop- down list Double-click chapter12-1classic_more.xml in the list of files

33. Chapter 12: Creating and Using XML Documents 33 Opening an XML Document and Saving It with a New Name Click File on the menu bar, and then click Save As on the File menu If necessary, navigate to the Chapter12\ChapterFiles folder on UDISK (G:) Type chapter12-1classic_books.xml in the File name text box Click the Save button in the Save As dialog box

34. Chapter 12: Creating and Using XML Documents 34 Starting Creating an XSL Style Sheet If necessary, activate the Notepad++ window Click File on the menu bar, and then New to start a new Notepad++ document With your USB drive plugged into your computer, click File on the menu bar, and then click Save As If necessary, navigate to the Chapter12\ ChapterFiles folder on UDISK (G:) Type chapter12-1author_solution.xsl in the File name text box Click the Save button in the Save As dialog box to save the chapter12-1author_solution.xsl style sheet Enter the code shown in Table 12–23 to start the XSL style sheet, and then press the ENTER key once after line 3

35. Chapter 12: Creating and Using XML Documents 35 Starting Creating an XSL Style Sheet

36. Chapter 12: Creating and Using XML Documents 36 Entering HTML Code to Display the Banner and Text Title in a Web Page Click line 4 Enter the code shown in Table 12–24 to enter the HTML tags to center the banner and format the title text. Press the ENTER key after line 8

37. Chapter 12: Creating and Using XML Documents 37 Entering HTML Code to Display the Banner and Text Title in a Web Page

38. Adding XSL Style Sheet Tags If necessary, click line 9 Enter the code shown in Table 12–28, indenting as shown, to complete the XSL style sheet Chapter 12: Creating and Using XML Documents 38

39. Adding XSL Style Sheet Tags Chapter 12: Creating and Using XML Documents 39

40. Saving an XSL Style Sheet With your USB drive plugged into your computer, click the Save icon on the Notepad++ toolbar to re-save the XSL style sheet chapter12- 1author_solution.xsl Chapter 12: Creating and Using XML Documents 40

41. Chapter 12: Creating and Using XML Documents 41 Linking an XSL Style Sheet to an XML Document Click the chapter12- 1classic_books.xml tab in Notepad++ Click at the beginning of line 3, then press the ENTER key once On line 4, type to enter the code to link the XSL style sheet to the XML document, then press the ENTER key once

42. Chapter 12: Creating and Using XML Documents 42 Linking an XSL Style Sheet to an XML Document

43. Chapter 12: Creating and Using XML Documents 43 Saving and Testing an XML Document Formatted Using an XSL Style Sheet With the USB drive plugged into your computer, click the Save icon on the Notepad++ toolbar to save the chapter12- 1classic_books.xml file Activate the browser Click the Address bar Type g:\Chapter12\ ChapterFiles\chapter12- 1classic_books.xml, and then press the ENTER key to display the XML document formatted by the XSL style sheet in author order

44. Chapter 12: Creating and Using XML Documents 44 Saving and Testing an XML Document Formatted Using an XSL Style Sheet

45. Chapter 12: Creating and Using XML Documents 45 Closing the XML and XSL Files in Notepad++ With the Notepad++ window active, right-click the chapter12-1classic_books.xml file tab, and click Close on the shortcut menu Right-click the chapter12-1classics.xml file tab and click Close on the shortcut menu Right-click the chapter12-1author_solution.xsl file tab, and click Close on the shortcut menu

46. Chapter 12: Creating and Using XML Documents 46 Creating an HTML Document to Display XML Data in a Table Activate the open Notepad++ window With a USB drive plugged into your computer, open the file chapter12-1table.html from the Chapter12\ChapterFiles folder Click File on the menu bar, and then click Save As Type chapter12-1tablesolution.html in the File name text box Click the Save button in the Save As dialog box to save the file with a new name

47. Chapter 12: Creating and Using XML Documents 47 Creating an HTML Document to Display XML Data in a Table

48. Chapter 12: Creating and Using XML Documents 48 Entering Code to Link an XML Document with an HTML Web Page With the chapter12- 1tablesolution.html Notepad++ window active, click line 6 Type to link the XML document to the HTML Web page. Do not press the ENTER key

49. Chapter 12: Creating and Using XML Documents 49 Entering Code to Link an XML Document with an HTML Web Page

50. Entering Code to Add Navigation Buttons Click line 15 Enter the code shown in Table 12–32 on the previous page and press the ENTER key twice after line 18 Chapter 12: Creating and Using XML Documents 50

51. Entering Table Header and Row Tags If necessary, click line 20 Enter the code shown in Table 12–33 to create the table header and press the ENTER key once after line 29 Chapter 12: Creating and Using XML Documents 51

52. Entering Table Header and Row Tags Chapter 12: Creating and Using XML Documents 52

53. Entering Tags and Attribute Values to Bind XML Elements to a Table If necessary, click line 30 Enter the code shown in Table 12–34 to bind the XML elements to the table rows. Do not press the ENTER key Chapter 12: Creating and Using XML Documents 53

54. Chapter 12: Creating and Using XML Documents 54 Saving the HTML File and Testing the Web Page With the USB drive plugged into your computer, click the Save icon on the Notepad++ toolbar Activate your browser. If necessary, maximize the window Click the Address bar Type g:\Chapter12\ChapterFiles\chapter12 1tablesolution.html and then press the ENTER key so the Web page is displayed in the browser If necessary, click the security bar under the tabs, click Allow Blocked Content, then click Yes in the Security Warning dialog box Click the Next Page button Click the First Page button and then click the Last Page button to scroll through the table

55. Chapter 12: Creating and Using XML Documents 55 Saving the HTML File and Testing the Web Page

56. Chapter 12: Creating and Using XML Documents 56 Opening an HTML Document and Saving It with a New Name If necessary, click the Notepad++ button on the taskbar to activate the Notepad++ window Close the chapter12-1tablesolution.html document window With the USB drive plugged into your computer, open chapter12-1fi ndauthor.html, from the Chapter12\ChapterFiles folder Save the file as chapter12- findauthorsolution.html

57. Chapter 12: Creating and Using XML Documents 57 Entering Code to Bind an XML Document with an HTML Web Page With the chapter12findauthorsolution.html Notepad++ window active, click line 6 Type, but do not press the ENTER key, to bind the XML document with the HTML code

58. Chapter 12: Creating and Using XML Documents 58 Entering Code to Bind an XML Document with an HTML Web Page

59. Chapter 12: Creating and Using XML Documents 59 Entering Code for the and Elements Click line 27 Enter the code in Table 12–35 on the previous page. Do not press the ENTER key after line 29

60. Chapter 12: Creating and Using XML Documents 60 Entering Code for the and Elements

61. Chapter 12: Creating and Using XML Documents 61 Entering an HTML Tag Container Click line 34 Type and press the ENTER key On line 35, type and do not press the ENTER key

62. Chapter 12: Creating and Using XML Documents 62 Entering an HTML Tag Container

63. Entering Code for the findAuthor() User- Defined Function Click line 10 Enter the code shown in Table 12–36 on the previous page and then press the ENTER key after line 17 to enter the findAuthor() user- defined function Chapter 12: Creating and Using XML Documents 63

64. Entering Code to Search the Recordset Values and Build the Output String If necessary, click line 18 Enter the code shown in Table 12–37 to search the recordset values and build the output string. Press the ENTER key after line 30 Chapter 12: Creating and Using XML Documents 64

65. Chapter 12: Creating and Using XML Documents 65 Entering Code to Complete the findAuthor() Function If necessary, click line 31 Enter the code shown in Table 12–38 to complete the findAuthor() function and then press the ENTER key twice at line 35

66. Entering Code for the keyPressed() Function If necessary, click line 37 Enter the code shown in Table 12–39 to create the keyPressed() function. Press the ENTER key twice after Line 40 Chapter 12: Creating and Using XML Documents 66

67. Entering Code for the clearField() Function If necessary, click line 42 Enter the code shown in Table 12–40 on the previous page to create the clearField() function. Do not press the ENTER key after line 49 Chapter 12: Creating and Using XML Documents 67

68. Entering Code for the clearField() Function Chapter 12: Creating and Using XML Documents 68

69. Chapter 12: Creating and Using XML Documents 69 Saving and Testing the HTML Document in the Browser With your USB drive plugged into your computer, click the Save icon on the Notepad++ toolbar Click the browser button on the taskbar to activate the browser Click the Address bar. Type g:\Chapter12\ChapterFiles\chapter12- 1findauthorsolution.html, and then press the ENTER key so the Web page is displayed in the browser If necessary, click the security bar under the tabs, click Allow Blocked Content, then click Yes in the Security Warning dialog box Enter the data values in the Author’s Name column in Table 12–41 in the input text box, and then click the Search button to test this Web page

70. Chapter 12: Creating and Using XML Documents 70 Saving and Testing the HTML Document in the Browser

71. Chapter 12: Creating and Using XML Documents 71 Verifying the Links on the Classic Books Home Page Click the Address bar Type g:\Chapter12\ChapterFiles\chapter12- 1homesolution.html, and then press the ENTER key to display the Web page in the browser Click the Books in Author Order image hot spot link After viewing the Web page, click the Back button on the browser toolbar to return to the Classic Books Web home page Click the Books in Title Order image hot spot link

72. Chapter 12: Creating and Using XML Documents 72 Verifying the Links on the Classic Books Home Page After viewing the Web page, click the Back button on the browser toolbar or click the Home link to return to the Classic Books Web page Click the Find Books image link Type dickens in the search text field, and then click Search to search for books written by Charles Dickens

73. Chapter 12: Creating and Using XML Documents 73 Verifying the Links on the Classic Books Home Page

74. Chapter 12: Creating and Using XML Documents 74 Quitting Notepad++ and the Browser Notepad++, click the File menu, then Close All Click the Close button on the Notepad++ title bar Click the Close button on the browser title bar. If necessary, click the Close all tabs button

75. Chapter 12: Creating and Using XML Documents 75 Chapter Summary Describe how XML differs from HTML Describe an XML document instance, and rules for creating a well-formed and valid XML document Define the purpose of the processing instruction, the document prolog, and the document instance Describe an XML Schema Defi nition (XSD) language file

76. Chapter 12: Creating and Using XML Documents 76 Chapter Summary Create and bind an XSL style sheet file to an XML document Discuss the uses of an XML data island Discuss the built-in table element methods for displaying an XML document in a table Create a JavaScript user-defined function to search an XML document

77. HTML, XHTML, and CSS Chapter 12 Complete Creating and Using XML Documents