Presentation is loading. Please wait.

Presentation is loading. Please wait.

Chapter 26 - Case Study: Active Server Pages and XML

Similar presentations


Presentation on theme: "Chapter 26 - Case Study: Active Server Pages and XML"— Presentation transcript:

1 Chapter 26 - Case Study: Active Server Pages and XML
Outline Introduction Setup and Message Forum Documents Forum Navigation Adding Forums Forum XML Documents Posting Messages Other Documents Internet and World Wide Web Resources

2 26.2 Setup and Message Forum Documents

3 26.3 Forum Navigation Fig Key interactions between message forum documents.

4 XML document that contains the information for forum ASP.
1 <?xml version = "1.0"?> 2 3 <!-- Fig : forums.xml --> 4 <!-- Creating the ASP forum --> 5 6 <forums> 7 <forum filename = "forumASP.xml">ASP</forum> 9 10 </forums> Forums.xml Name of forum. XML document that contains the information for forum ASP.

5 Link to CSS style sheet style.css.
1 = "VBScript" %> 2 3 <% ' Fig : default.asp ' Forum home page Option Explicit 6 %> 7 8 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 9 " 10 11 <html xmlns = " 12 <head> <title>Deitel Message Forums</title> <link rel = "stylesheet" type = "text/css" href = "style.css" /> </head> 18 <body> <h1>Deitel Message Forums</h1> <p><strong>Available Forums</strong></p> <ul> 23 <% Dim xmlFile, xmlNodes, xmlItem Dim strPath, strTitle, strFileName 26 strPath = Server.MapPath( "forums.xml" ) 28 Set xmlFile = Server.CreateObject( "Microsoft.XMLDOM" ) xmlFile.Async = False 31 If Not xmlFile.Load( strPath ) Then Call Server.Transfer( "invalid.html" ) End If 35 Default.asp Link to CSS style sheet style.css. Setting Async to False causes the object referenced by xmlFile to behave synchronously. Instantiate an XML DOM object. Method Load parses the XML document forums.xml. If the parsing fails, the browser is redirected to invalid.html.

6 Property DocumentElement gets the root element’s child nodes.
Set xmlNodes = xmlFile.DocumentElement.ChildNodes 37 For Each xmlItem In xmlNodes strFileName = xmlItem.getAttribute( "filename" ) strTitle = xmlItem.text 41 %> <li> <a href = "<% =strFileName %>"><% =strTitle %></a> </li> 45 <% Next 47 %> </ul> 49 <p><strong>Forum Management</strong></p> 51 <ul> <li><a href = "addForum.asp">Add a Forum</a></li> <li>Delete a Forum</li> </ul> 56 </body> 58 59 </html> Property DocumentElement gets the root element’s child nodes. Property ChildNodes returns a collection of the element node’s child nodes. Default.asp Method getAttribute gets a forum’s filename. The anchor element creates a link to the available forums. This anchor element links to the ASP document addForum.asp that allows the user to create a new forum.

7 Program Output

8 The stylesheet processing instruction references formatting.xsl.
1 <?xml version = "1.0"?> 2 3 <!-- Fig : template.xml --> 4 <!-- Template XML document --> 5 6 <?xml:stylesheet type = "text/xsl" href = "formatting.xsl"?> 7 8 <forum> 9 </forum> Template.xml The stylesheet processing instruction references formatting.xsl.

9 Check to see if a value was enetered in each of the form fields.
1 = "VBScript" %> 2 <% Option Explicit %> 3 4 <% ' Fig : addForum.asp %> 5 6 <% Dim xmlFile, xmlRoot, xmlNode Dim strTitle, strError, strPath 9 If Request( "submit" ) <> Empty Then 11 If Request( "name" ) <> Empty And _ Request( "filename" ) <> Empty And _ Request( "user" ) <> Empty And _ Request( "title" ) <> Empty And _ Request( "text" ) <> Empty Then 17 ' Create a new XML file strPath = Server.MapPath( Request( "filename" ) ) 20 Set xmlFile = Server.CreateObject( "Microsoft.XMLDOM" ) xmlFile.Async = False 23 If xmlFile.Load( strPath ) Then Call Server.Transfer( "invalid.html" ) End If 27 ' set up the file Call xmlFile.Load( Server.MapPath( "template.xml" ) ) 30 ' get the root element Set xmlRoot = xmlFile.DocumentElement 33 Test to see if the form was submitted by testing the form’s Submit field for a value. Check to see if a value was enetered in each of the form fields. AddForum.asp Method Load loads the template XML document.

10 Calling method Save saves the XML document to disk.
' set the filename Call xmlRoot.SetAttribute( "filename", _ Request( "filename" ) ) 37 ' create Name node Set xmlNode = xmlFile.CreateElement( "name" ) xmlNode.Text = Request( "name" ) Call xmlRoot.AppendChild( xmlNode ) 42 ' create first message Set xmlNode = xmlFile.CreateElement( "message" ) Call xmlNode.SetAttribute( "timestamp", Now & " EST" ) Call xmlRoot.AppendChild( xmlNode ) 47 Set xmlRoot = xmlNode 49 ' create user node Set xmlNode = xmlFile.CreateElement( "user" ) xmlNode.Text = Request( "user" ) Call xmlRoot.AppendChild( xmlNode ) 54 ' create title node Set xmlNode = xmlFile.CreateElement( "title" ) xmlNode.Text = Request( "title" ) Call xmlRoot.AppendChild( xmlNode ) 59 ' create text node Set xmlNode = xmlFile.CreateElement( "text" ) xmlNode.Text = Request( "text" ) Call xmlRoot.AppendChild( xmlNode ) 64 Call xmlFile.Save( strPath ) ' save the file 66 ' load XML file strPath = Server.MapPath( "forums.xml" ) Method setAttribute creates an attribute node named filename that has the value contained in form field filename. AddForum.asp Method AppendChild appends the newly created element name node to the root element. Calling method Save saves the XML document to disk.

11 Open XML document forums.xml.
69 Set xmlFile = Server.CreateObject( "Microsoft.XMLDOM" ) xmlFile.Async = False 72 If Not xmlFile.Load( strPath ) Then Call Server.Transfer( "invalid.html" ) End If 76 ' get the root node Set xmlRoot = xmlFile.DocumentElement 79 ' create nodes Set xmlNode = xmlFile.CreateElement( "forum" ) Call xmlNode.SetAttribute( "filename", _ Request( "filename" ) ) xmlNode.Text = Request( "name" ) Call xmlRoot.AppendChild( xmlNode ) 86 Call xmlFile.Save( strPath ) ' save the file 88 ' finished processing Call Server.Transfer( "default.asp" ) Else strError = "ERROR: Invalid input." End If 94 End If 96 %> 97 98 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 101 AddForum.asp Open XML document forums.xml. Modify forums.xml. Save forums.xml with its new contents to disk.

12 102 <html xmlns = "http://www.w3.org/1999/xhtml">
103 <head> <title>Add a Forum</title> <link rel = "stylesheet" type = "text/css" href = "style.css" /> 106 </head> 107 108 <body> <p>Create a Forum</p> <p><% =strError %></p> 111 <form method = "post" action = "addForum.asp"> 113 <h2> Forum Name:<br /> <input type = "text" size = "40" name = "name" value = "<% =Request( "name" ) %>" /> </h2> 119 <h2> Forum File Name:<br /> <input type = "text" size = "40" name = "filename" value = "<% =Request( "filename" ) %>" /> </h2> 125 <h2> User:<br /> <input type = "text" size = "40" name = "user" value = "<% =Request( "user" ) %>" /> </h2> 131 <h2> Message Title:<br /> <input type = "text" size = "40" name = "title" value = "<% =Request( "title" ) %>" /> </h2> This XHTML form allows a user to input the name, filename, a user name, a message title and the message text to create a new forum. AddForum.asp

13 The Clear button will delete all values in the form fields.
137 <h2> Message Text:<br /> <textarea name = "text" cols = "40" rows = "4"><% =Request( "text" ) %></textarea> </h2> 143 <h2> <input type = "submit" name = "submit" value = "Submit" /> <input type = "reset" value = "Clear" /> </h2> 148 </form> 150 <p> <a href = "default.asp">Return to Main Page</a> </p> 154 155 </body> 156 157 </html> AddForum.asp The Submit button submits the form and the values input in the form fields. The Clear button will delete all values in the form fields.

14 Program Output

15 Name of forum. ForumASP.xml
1 <?xml version = "1.0"?> 2 3 <!-- Fig : forumASP.xml --> 4 <!-- Postings on ASP forum --> 5 6 <?xml:stylesheet type = "text/xsl" href = "formatting.xsl"?> 7 8 <forum filename = "forumASP.xml"> 9 <name>ASP Forum</name> 11 <message timestamp = "4/28/2001 2:50:34 PM EST"> <user>D. Bug</user> <title>I Love ASP!</title> <text>Everyone should use ASP.</text> </message> 17 <message timestamp = "5/8/ :09:54 AM EST"> <user>Ms. Quito</user> <title>ASP and XML</title> <text>What a powerful combination. Try it!</text> </message> 23 <message timestamp = "5/15/2001 4:39:50 PM EST"> <user>Sarge Ant</user> <title>ASP</title> <text>This <em>army ant</em> uses ASP in boot camp.</text> </message> 29 30 </forum> Name of forum. ForumASP.xml Each message element and its children contain the information for a post.

16 Element xsl:stylesheet is the XSLT document’s root element
1 <?xml version = "1.0"?> 2 3 <!-- Fig : formatting.xsl > 4 <!-- XSL document that transforms XML data to XHTML --> 5 6 <xsl:stylesheet version = "1.0" xmlns:xsl = " 8 <xsl:output method = "html" omit-xml-declaration = "no" doctype-system = " doctype-public = "-//W3C//DTD XHTML 1.0 Strict//EN" /> 13 <xsl:template match = "/"> 15 <html xmlns = " <xsl:apply-templates select = "*" /> </html> 19 </xsl:template> 21 <xsl:template match = "forum"> 23 <head> <title><xsl:value-of select = "name"/></title> <link rel = "stylesheet" type = "text/css" href = "style.css" /> </head> 29 Attribute version specifies the XSLT version to which this style sheet conforms. Element xsl:stylesheet is the XSLT document’s root element Attribute omit-xml-declaration is assigned no, which results in an XML declaration in the result tree. The xsl:output element specifies how the result tree is output. The attribute xmlns creates a namespace prefix xsl. Formatting.xsl Attribute method is assigned xml, which specifies that an XML document is being output. This template that matches the XML document root (/). The asterisk selects element nodes. Link to the CSS style sheet style.css.

17 Get value of name element.
<body> 31 <table width = "100%" cellspacing = "0" cellpadding = "2"> <tr> <td class = "forumTitle"> <xsl:value-of select = "name" /> </td> </tr> </table> 40 <table width = "100%" cellspacing = "0" cellpadding = "2"> <xsl:apply-templates select = "message" /> </table> 46 <p> <a> <xsl:attribute name = "href">addPost.asp?file=<xsl:value-of select = /> </xsl:attribute> Post a Message</a><br /> <a href = "default.asp">Return to Main Page</a> </p> 56 </body> 58 </xsl:template> 60 <xsl:template match = "message"> 62 Formatting.xsl Get value of name element. Get the value of attribute filename. Apply message template. Begin template message.

18 Get value of user element. Get value of attribute timestamp.
<td class = "msgTitle"> <xsl:value-of select = "title" /> </td> </tr> 68 <tr> <td class = "msgInfo"> by <em><xsl:value-of select = "user" /></em> at <span class = "date"> <xsl:value-of select = /> </span> </td> </tr> 79 <tr> <td class = "msgText"> <xsl:value-of select = "text" /> </td> </tr> 85 86 </xsl:template> 88 89 </xsl:stylesheet> Formatting.xsl Get value of user element. Get value of attribute timestamp. Get value of text element.

19 ForumASP_transformed.html Forum title. Message title.
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 3 4 <!-- Fig : forumASP_transformed.html --> 5 <!-- Results of transforming forumASP.xml --> 6 7 <html xmlns = " 8 <head> <title>ASP Forum</title> <link href = "site.css" type = "text/css" rel = "stylesheet" /> </head> 13 <body> <table cellpadding = "2" cellspacing = "0" width = "100%"> <tr> <td class = "forumTitle">ASP Forum</td> </tr> </table> 20 <table cellpadding = "2" cellspacing = "0" width = "100%"> <tr> <td class = "msgTitle">I Love ASP!</td> </tr> <tr> <td class = "msgInfo"> by <em>D. Bug</em> at <span class = "date">4/28/2001 2:50:34 PM EST</span></td> </tr> <tr> ForumASP_transformed.html Forum title. Message title. Time and date posted. Message author.

20 ForumASP_transformed.html Time and date posted. Message author.
<td class = "msgText">Everyone should use ASP.</td> </tr> <tr> <td class = "msgTitle">ASP and XML</td> </tr> <tr> <td class = "msgInfo"> by <em>Ms. Quito</em> at <span class = "date">5/8/ :09:54 AM EST</span></td> </tr> <tr> <td class = "msgText"> What a powerful combination. Try it!</td> </tr> <tr> <td class = "msgTitle">ASP</td> </tr> <tr> <td class = "msgInfo"> by <em>Sarge Ant</em> at <span class = "date">5/15/2001 4:39:50 PM EST</span></td> </tr> <tr> <td class = "msgText"> This army ant uses ASP in boot camp.</td> </tr> </table> 64 Message text. Time and date posted. ForumASP_transformed.html Message title. Message author. Message text. Message title. Time and date posted. Message author. Message text.

21 ForumASP_transformed.html Program Output
<a href = "addPost.asp?file=forumASP.xml">Post a Message</a> <br> <a href = "default.asp">Return to Main Page</a> </p> 70 </body> 72 73 </html> Link to add a new post. ForumASP_transformed.html Program Output

22 Check to see if a value was enetered in each of the form fields.
1 = "VBScript" %> 2 3 <% ' Fig : addPost.asp ' ASP document for posting a message 5 Option Explicit 7 Dim xmlFile, xmlRoot, xmlNode Dim strTitle, strError, strPath 10 If Request( "submit" ) <> Empty Then 12 If Request( "file" ) <> Empty And _ Request( "userName" ) <> Empty And _ Request( "messageTitle" ) <> Empty And _ Request( "messageText" ) <> Empty Then 17 strPath = Server.MapPath( Request( "file" ) ) 19 Set xmlFile = Server.CreateObject( "Microsoft.XMLDOM" ) xmlFile.Async = False 22 If Not xmlFile.Load( strPath ) Then Call Server.Transfer( "invalid.html" ) End If 26 ' get the root node Set xmlRoot = xmlFile.DocumentElement 29 ' create first message Set xmlNode = xmlFile.CreateElement( "message" ) Call xmlNode.SetAttribute( "timestamp", Now & " EST" ) Call xmlRoot.AppendChild( xmlNode ) 34 Set xmlRoot = xmlNode Check to see if a value was enetered in each of the form fields. Test to see if the form was submitted by testing the form’s Submit field for a value. AddPost.asp Method Load loads the forum XML document. Create a message node. Create a timeStamp attribute for the message node.

23 Create the children of the message node: user, title and text.
36 ' create user node Call CreateElementNode( "user", "userName", xmlNode ) 39 ' create title node Call CreateElementNode( "title", "messageTitle", xmlNode ) 42 ' create text node Call CreateElementNode( "text", "messageText", xmlNode ) 45 Call xmlFile.Save( strPath ) ' save the file 47 ' finished processing Call Server.Transfer( Request( "file" ) ) Else strError = "ERROR: Invalid input." End If 53 End If 55 ' procedure that creates an element node Sub CreateElementNode( elementName, formElement, node ) Set xmlNode = xmlFile.CreateElement( elementName ) xmlNode.Text = Request( formElement ) Call xmlRoot.AppendChild( xmlNode ) End Sub 62 %> 63 64 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 65 " 66 Create the children of the message node: user, title and text. AddPost.asp

24 67 <html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title>Post a Message</title> <link rel = "stylesheet" type = "text/css" href = "style.css" /> </head> 73 <body> <p><% =strError %></p> 76 <form method = "post" action = "addPost.asp"> <p> User:<br /> <input type = "text" size = "40" name = "userName" value = "<% =Request( "userName" ) %>" /> </p> 83 <p> Message Title:<br /> <input type = "text" size = "40" name = "messageTitle" value = "<% =Request( "messageTitle" ) %>" /> </p> 89 <p> Message Text:<br /> <textarea name = "messageText" cols = "40" rows = "4"><% =Request( "messageText" ) %> </textarea> </p> 96 <p> <input type = "hidden" name = "file" value = "<% =Request( "file" ) %>"/> <input type = "submit" name = "submit" value = "Submit" /> AddPost.asp This form allows the user to create a post by entering the values into the form fields.

25 AddPost.asp Program Output
<input type = "reset" value = "Clear" /> </p> </form> 104 <p> <a href = "<% =Request( "file" ) %>">Return to Forum</a> </p> </body> 109 110 </html> AddPost.asp Program Output

26 26.6 Posting Messages Fig New forum on the message board.

27 26.6 Posting Messages Fig Initial content of the newly added forum.

28 26.7 Other Documents Fig Contents of the Internet and World Wide Web: 2nd Edition.

29 Link that references CSS style sheet site.css.
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 2 " 3 4 <!-- Fig : invalid.html > 5 <!-- XHTML document for displaying errors --> 6 7 <html xmlns = " 8 <head> <title>Deitel Book Organization</title> <link rel = "stylesheet" type = "text/css" href = "site.css" /> </head> 14 <body> <h1>Invalid Request.</h1> 17 <p><a href = "default.asp">Return to Main Page</a></p> </body> 20 21 </html> Invalid.html Link that references CSS style sheet site.css.

30 Define styles for the body element.
1 /* Fig : site.css */ 2 /* Stylesheet for XHTML documents */ 3 4 body 5 { background: white; color: black; font-family: Arial, sans-serif; font-size: 10pt; 10 } 11 12 a 13 { background: transparent; color: blue; text-decoration: none; 17 } 18 19 a:hover 20 { text-decoration: underline; 22 } 23 24 table 25 { border-width: 1px; border-style: solid; 28 } 29 30 .forumTitle 31 { background: lime; color: black; font-size: 12pt; font-weight: bold; Site.css Define styles for the body element. Define styles for the anchor element. Define styles for the table element.

31 Site.css 36 text-align: center; 37 } 38 39 .msgTitle 40 {
37 } 38 39 .msgTitle 40 { background: silver; color: black; font-size: 10pt; font-weight: bold; 45 } 46 47 .msgInfo 48 { background: silver; color: black; font-size: 10pt; 52 } 53 54 .msgPost 55 { background: silver; color: black; font-size: 8pt; 59 } 60 61 .msgText 62 { font-size: 10pt; padding-left: 10px; 65 } 66 67 .date 68 { font-size: 8pt; 70 } Site.css

32 Define styles for the h1 element.
1 /* Fig : style.css */ 2 /* Stylesheet for forums */ 3 4 h1 5 { color: #330099; letter-spacing: 2px; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; background-color: transparent; 10 } 11 12 h2 13 { color: #6633FF; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: small; background-color: transparent; 18 } 19 20 p 21 { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #336666; letter-spacing: 1px; font-size: larger; font-weight: bold; background-color: transparent; 28 } 29 30 body 31 { background-image: url(bug2.gif); background-repeat: no-repeat; margin-top: 5%; background-position: 25%; Style.css Define styles for the h1 element. Define styles for the h2 element. Define styles for the p element. Define styles for the body element.

33 Define styles for the li element.
margin-left: 10%; 37 } 38 39 li 40 { font-family: "Courier New", Courier, monospace; font-weight: bolder; list-style-type: circle; color: #3333FF; background-color: transparent; 46 } 47 48 input 49 { background-color: transparent; color: #336666; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 53 } 54 55 textarea 56 { background-color: transparent; color: #336666; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 60 } 61 62 .forumTitle 63 { color: #FFFFCC; font-size: 14pt; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; text-align: center; background-color: #6666CC; 69 } 70 Style.css Define styles for the li element. Define styles for the input element. Define styles for the textarea element.

34 Style.css 71 .msgTitle 72 { 73 background: #FFFFCC; 74 color: black;
72 { background: #FFFFCC; color: black; font-size: 10pt; font-weight: bold; 77 } 78 79 .msgInfo 80 { background: #FFFFCC; color: black; font-size: 10pt; 84 } 85 86 .msgPost 87 { background: silver; color: black; font-size: 8pt; 91 } 92 93 .msgText 94 { font-size: 10pt; padding-left: 10px; 97 } 98 99 .date 100 { font-size: 8pt; 102 } Style.css


Download ppt "Chapter 26 - Case Study: Active Server Pages and XML"

Similar presentations


Ads by Google