Tài liệu Module 7: Posting XML Data from Client to Server docx

Contents Overview 1 Preparing XML Data on the Client 2 Posting Data to the Server 11 Lab 7.1: Sending XML Packets to the Server 16 DOM Manipulation on the Server 24 Receiving the R

Contents

Overview 1

Preparing XML Data on the Client 2

Posting Data to the Server 11

Lab 7.1: Sending XML Packets to the

Server 16

DOM Manipulation on the Server 24

Receiving the Response on the Client 36

Lab 7.2: Processing XML Packets at the

Server 42

Review 54

Module 7: Posting XML Data from Client to

Server

to represent any real individual, company, product, or event, unless otherwise noted Complying with all applicable copyright laws is the responsibility of the user No part of this document may

be reproduced or transmitted in any form or by any means, electronic or mechanical, for any purpose, without the express written permission of Microsoft Corporation If, however, your only means of access is electronic, permission to print one copy is hereby granted

Microsoft may have patents, patent applications, trademarks, copyrights, or other intellectual property rights covering subject matter in this document Except as expressly provided in any written license agreement from Microsoft, the furnishing of this document does not give you any license to these patents, trademarks, copyrights, or other intellectual property

 2000 Microsoft Corporation All rights reserved

Microsoft, PowerPoint, Visual InterDev, and Windows are either registered trademarks or trademarks of Microsoft Corporation in the U.S.A and/or other countries

The names of companies, products, people, characters, and/or data mentioned herein are fictitious and are in no way intended to represent any real individual, company, product, or event, unless otherwise noted

Other product and company names mentioned herein may be the trademarks of their respective owners

Program Manager: Steve Merrill

Instructional Designers: Sangeeta Nair (NIIT), Vijayalakshmi Narayanaswamy (NIIT)

Subject Matter Experts: Andy Olsen (QA Training), Andy Longshaw (Content Masters)

Content Lead: Janet Robinson

Graphic Artist: Scott Serna (Creative Assets)

Media Management: David Mahlmann

Media Production: Dean Connolly (Art Source), Timothy Demmon (:timebomb Media)

Editing Manager: Jennifer Linn

Editor: Dennis Rae (Wasser)

Production Manager: Miracle Davis

Print Coordinator: Marlene Lambert (Online Training Solutions, Inc)

Build Manager: Julie Challenger

Build Coordinator: Jenny Boe

Test Lead: Eric Myers

Manufacturing Manager: John Williams

Group Product Manager: Steve Elston

XMLHTTP object can be used to achieve this

The module also shows how the server receives this data and loads it into a

server-side XMLDOM object This is the first time students have seen that you

can use DOM on the server — all previous examples of DOM have been side It’s worthwhile to mention that it is the same object model, so you can do anything at the server that you can do at the browser

client-The module concludes by describing how the Web server can send an HTML or XML response back to the client, and how the client picks up this response After completing this module, students will be able to:

! Describe the issues involved in creating an XML data packet to send to a server

! Use the XMLHTTP object to send data back to the server

! Convert XML into a server-side DOM tree

! Update the back-end database with data from the client

! Issue a response from the server to the client

Materials and Preparation

This section provides you with the required materials and preparation tasks that you need to teach this module

Required Materials

To teach this module, you need the following materials:

! Microsoft PowerPoint® file 1905a_07.ppt

! Module 7, “Posting XML Data from Client to Server”

! Lab 7.1, “Sending XML Packets to the Server”

! Lab 7.2, “Processing XML Packets at the Server”

Preparation Tasks

To prepare for this module, you should:

! Read all of the materials for this module

! Complete the labs

Due to the length of the answers to the labs for this course, we were unable

to include them in the Delivery Guide Please see Appendix A and the Student CD for the lab answers

Demonstrations

This section provides demonstration procedures that will not fit in the margin notes or are not appropriate for the student notes

Handling responses on the client

! Discuss the code in ResponseXML.htm

1 In Notepad, open ResponseXML.htm

2 Move to the end of ResponseXML.htm and point out the three BUTTON elements Each button has a different onclick event procedure

3 Move to the beginning of ResponseXML.htm and briefly show the three onclick event procedures Note that each calls the same procedure, prepareToPost

4 Examine the prepareToPost procedure in detail

It begins with some boilerplate XML, and then adds new XML content for the customer ID (as entered by the user) The code then clones an existing XML data island (located near the end of the HTM page) and adds this to the XML data packet as well

5 Reexamine the event procedures responseStr_OnClick, responseHTML_OnClick, and responseXML_OnClick Each procedure

submits the XML data packet to a different ASP page

! Discuss the code in the ASPs

1 In Notepad, open CustOrderStr.asp This ASP page returns simple text

2 In Notepad, open CustOrderHTML.asp This ASP page returns HTML content

3 In Notepad, open CustOrderXML.asp This ASP page creates an

XMLDOM object, loads the XML sent from the browser, and returns the same XML back to the browser Note that the Response.ContentType must

be set to “text/xml” first

! Add code to ResponseXML.htm to handle ASP responses

1 In Notepad, open ResponseXML.htm

2 Add code to the event procedures to show the string/HTML/XML response from the various ASPs:

a Add the following script to responseStr_OnClick to display the

response from the server:

MsgBox poster.responseText, , "Response from Server"

b Add the following script to responseHTML_OnClick to display the

response from the server:

MsgBox poster.responseText, , "Response from Server"

c Add the following script to responseXML_OnClick to display the

response from the server:

MsgBox poster.responseXML.xml, , "Response from Server"

Module Strategy

Use the following strategies to present this module:

! Preparing XML Data on the Client

In this section, begin by reviewing how XML data is sent from the Web server to the client, and discuss the benefits of delivering XML rather than HTML

Briefly introduce the XMLHTTP object and discuss how it orchestrates the

transmission of XML data from the client to the server Then describe how

the server loads the XML data into a server-side XMLDOM object in order

to process that data on the server

It’s worthwhile to describe how the client builds the XML data packet,

ready to send to the server In particular, describe how the clone method is

used to clone data from another XML document (or data island) and merge

it with the XML document being sent to the server If you don’t use the

clone method, the XML data will be removed from the original DOM tree

and added into the new one

! Posting Data to the Server

This brief section describes how to use the XMLHTTP object to send XML

data from the client to the server Point out that the data can be sent synchronously (the client waits for a response from the server before continuing processing) or asynchronously (the client continues processing without waiting for a response)

! Lab 7.1: Sending XML Packets to the Server

In this lab, students complete the Go to Checkout functionality in an

HTML file named Checkout.htm An XML data packet is assembled from the orders data island, together with information about the customer An

XMLHTTP object is then created, and the XML data packet is posted to an

ASP page named CustomerOrder.asp The ASP page doesn’t do much at the moment — that’s the subject of Lab 7.2

! DOM Manipulation on the Server There are two main points to emphasize here: First, the ASP page receiving

a request that contains XML data creates an XMLDOM object to hold the XML data from the client; second, this XMLDOM object has the same

DOM programming interface as on the client Therefore, the same capabilities exist for server-side XML data manipulation

Also observe that the server can issue any type of response back to the client, such as plain text, an HTML page, or more XML data (either a static XML document or dynamically-generated XML data)

! Receiving the Response on the Client This section describes how the client picks up different types of responses from the server The demonstration illustrates how to handle a plain text response, an HTML response, and an XML response

! Lab 7.2: Processing XML Packets at the Server This lab modifies CustomerOrder.asp to perform intelligent processing when it receives an XML data packet from the client The ASP page updates various tables in the LitWare Books database, and then issues an HTML response back to the client (One of the optional exercises returns an XML response instead.)

Note that all the SQL statements required in this lab have already been provided in starter files, to save time for the students and to focus on XML issues rather than SQL

# Overview

! Preparing XML Data on the Client

! Posting Data to the Server

! Lab 7.1: Sending XML Packets to the Server

! DOM Manipulation on the Server

! Receiving the Response on the Client

! Lab 7.2: Processing XML Packets at the Server

! Review

In this module, you will learn how to post XML data from the client to the server You will also learn how the server picks up the XML data and sends a suitable response back to the client

After completing this module, you will be able to:

! Describe the issues involved in creating an XML data packet to send to a server

! Use the XMLHTTP object to send data back to the server

! Convert XML into a server-side DOM tree

! Update the back-end database with data from the client

! Issue a response from the server to the client

In this module, you will learn

about the process of

sending updated XML data

back to the server You will

also learn how the server

responds when receiving

the data

# Preparing XML Data on the Client

! Client/Server XML Application Architecture

! Sending XML Data from Client to Server

! Building an XML Data Packet

! Populating an XML Data Packet

! Demonstration: Preparing XML Data on the Client

This section describes the traditional Get/Post feedback techniques used with Web servers It also explains why XML and related technologies are used instead of the common practice of using ADO on the server, RDS on the client, and feedback via forms, and so on

posting XML data from the

client to the server

Client/Server XML Application Architecture

! Use XML to communicate between client and server

Order info XML

Catalog XML Read catalog

Update database

Build XML data packet

1 2

3

Thus far, all of the data flow we have discussed has been from the Web server

to the client We have examined how XML data can be used to represent the information sent from the server to the client

It is also possible for the client to send XML information back to the server, for example, a list of items in a shopping basket A traditional Web application might send small updates to the server as each individual item is added to the shopping basket This method is rather inefficient in its use of network and server resources

It would be far more efficient to cache all the information on the client and then send it to the server in a single batch In this way, additions and alterations to the pending updates would occur only on the client, without involving the network or server Using XML data to transfer information enables you to cache all data on the client and send only the updates to the server

The preceding illustration shows a typical interaction between a Web server and

a client, using XML data to relay information in both directions:

1 The Web server reads information from a data source, for example, a catalog of books in a bookstore database

2 The Web server builds an XML document from this data and sends the XML to the client

3 The client builds an XML data packet, for example, a list of books the user would like to order from the catalog

4 The client sends the XML data packet to the Web server when required

5 The Web server receives the XML data packet from the client and processes the data appropriately For example, the Web server might update the OrderItems table in the bookstore database

discussed topics and

concepts that have pieced

together an architecture for

a client/server XML

application Now we will

discuss how to post XML

data back to the server

Delivery Tip

The slide is animated so

that it shows only the Client,

Web server, and Data

source boxes initially Click

the slide to reveal the

following additional parts of

the illustration:

1 Shows the arrow, text,

and label “1” for data being

read from the data source to

the Web server

2 Shows the arrow, text,

and label “2” for XML data

being sent to the client

3 Shows the arrow, text,

and label “3” for the XML

data packet being built at

the client

4 Shows the arrow, text,

and label “4” for the XML

data packet being sent to

the server

5 Shows the arrow, text,

and label “5” for database

updates being sent to the

data source

Sending XML Data from Client to Server

! Client creates an XML data packet and posts it to the server

XML DOM tree

1

XMLHTTP object

2

XMLDOM object

4

XML DOM tree

Let’s consider each of the following steps:

1 The client populates an XMLDOM object with XML data to send to the

Web server

2 The client creates an XMLHTTP object This object has various methods

and properties that are used to send the XML data to an application (for example, an ASP page) at the Web server and receive a response

3 The client loads the XML data packet into the XMLHTTP object, and then

sends the data to the ASP page at the Web server

4 The Web server executes the ASP page The ASP creates a server-side

XMLDOM object that is ready to receive the XML data from the client

5 The ASP loads the XML data packet into the XMLDOM object at the

data packet at the client and

posting it to the server

Lead-in

Let’s consider the steps

involved in building an XML

data packet at the client,

posting it to the server, and

then processing the data

when it is received at the

server

Delivery Tip

The slide is animated so

that it shows only the Client

and Web server boxes

initially Click the slide to

reveal the following

additional parts of the

illustration:

1 Shows the arrow and

label “1” for creating the

XML data packet

2 Shows the arrow and

label “2” for creating the

XMLHTTP object

3 Shows the arrow and

label “3” for posting the XML

data packet to the server

4 Shows label “4” for

creating the XMLDOM

object on the server

5 Shows the arrow and

label “5” for loading the XML

data packet into the

XMLDOM object on the

server

6 Shows the arrow and

label “6” for performing

appropriate server-side

processing based on the

contents of the XML data

packet

Building an XML Data Packet

! Create an XMLDOM object

! Load the XMLDOM object with XML

docSubmit.async = FalsedocSubmit.loadXML "<?xml version='1.0'?>" & _

Set docSubmit = CreateObject("Microsoft.XMLDOM")

Let’s examine how to build an XML data packet at the client that is ready to be sent to the Web server

The first step is to create an XMLDOM object that will hold the XML data

packet at the client The XML data packet can be any XML document, or a part

of a document For example, the XML data packet could contain data from any

of the following sources:

! An XML data island at the client

! A stand-alone XML document

! A dynamically generated XML document containing a mixture of boilerplate XML definitions, data from XML data islands, and data created from user input at the client

Example of building an XML data packet

For example, if you send data about a customer’s order from the client to the server, you need to wrap the order XML data with the customer’s ID

The following script creates an XMLDOM object and loads a boilerplate XML

document into it that contains the customer’s ID as entered in a textbox on the page:

Set docSubmit = CreateObject("Microsoft.XMLDOM") docSubmit.async = False

docSubmit.loadXML "<?xml version='1.0'?>" & _ "<customerorder>" & _ " <customer>" & txtCustomerID.Value & _ " </customer>" & _ "</customerorder>"

Slide Objective

To introduce the tasks

required to package the

data that is to be sent back

to the server

Lead-in

Let’s consider how the client

prepares the XML data to be

sent back to the Web

server

If the user enters “5” as their customer ID, this script builds the following boilerplate XML document:

Populating an XML Data Packet

! Retrieving data from XML data islands or documents

Set docOrder = dsoOrder.XMLDocumentSet nodeOrder = docOrder.documentElementdocSubmit.documentElement.appendChild _

nodeOrder.cloneNode(True)

Set docOrder = dsoOrder.XMLDocumentSet nodeOrder = docOrder.documentElementdocSubmit.documentElement.appendChild _

nodeOrder.cloneNode(True)

Once you have created a boilerplate XML document, the next step is to populate the document with the data you wish to send to the Web server

Typically, the XML data packet includes a mixture of content:

! XML data created from user input

! XML data retrieved from XML data islands or XML documents

Creating XML data from user input

Frequently you will have user input that you need to merge into the XML data before sending the XML to the server You can do this either by building the

XML from a string with the loadXML method, or by using DOM to locate the

element or attribute and change its value

For more information on using DOM to change XML data, see Module 6,

“Manipulating XML Data on the Client Using DOM.”

Retrieving data from XML data islands and documents

In addition to creating new content from user input, XML data packets can also contain a copy of the existing data held in XML data islands and/or XML documents

Slide Objective

To populate an XML data

packet with information from

XML data islands and user

input

Lead-in

Now that we have a

boilerplate XML document,

the next step is to populate

it with the data we wish to

send to the Web server

For example, if you have a data island at the client for keeping a list of all books ordered by the user, the XML data island might look like the following:

! To add existing XML into the DOM tree

1 Access the XML data island

The following script provides access to the <order> element in the XML data island

Set docOrder = dsoOrder.XMLDocument Set nodeOrder = docOrder.selectSingleNode("//order")

2 Create a copy of the required XML data

The <order> element you just obtained is part of an existing DOM tree (that

is, the dsoOrder XML data island) To add the element to a different DOM tree (for example, the XML data packet), you must first make a copy of the

<order> element and all its child elements This is because the method

appendChild will remove the node from the tree it is currently in before

adding it to the new DOM tree

The cloneNode method achieves this effect The method takes a single

parameter that indicates whether child elements should be included in the copy:

Set nodeOrderToSend = nodeOrder.cloneNode(True)

3 Add the copied data to the XML data packet

The following script adds the copied data to the XML data packet:

docSubmit.documentElement.appendChild nodeOrderToSend After executing this script, the XML data packet appears as follows:

Demonstration: Preparing XML Data on the Client

In this demonstration, you will learn how to prepare an XML data packet at the client that is ready to be sent to the Web server The XML data packet will include XML data from the following three sources:

! Boilerplate XML elements, which define the overall structure of the XML document that will be sent to the Web server

! Additional XML data, which is created from the information entered at the client by the user

! XML data that is retrieved from existing data islands on the client

Slide Objective

To demonstrate how to

create an XML data packet

that is ready to be sent to a

Web server

Lead-in

In this demonstration, you

will learn how to create an

XMLDOM object on the

client and populate it with a

mixture of boilerplate XML

data, XML data from a data

island, and XML data based

on user input

Delivery Tip

1 In Notepad, open the file

AppendXML.htm from the

folder

\InetPub\WWWRoot\1905\D

emoCode\Mod07

2 Notice the XML data

island Also notice the

HTML text field and button

3 Show the code for the

button’s onclick event

procedure

4 Launch Internet

Explorer 5, and open

AppendXML.htm Enter a

number such as “123” in the

text field and click the

button A message box

displays the XML in the data

packet

The demonstration uses the following code:

Sub cmdSubmit_OnClick() 'Create XMLDOM object and load in customer information Set docSubmit = CreateObject("Microsoft.XMLDOM") docSubmit.async = False

docSubmit.loadXML "<?xml version='1.0'?>" & _ "<customerorder>" & _ " <customer>" & txtCustomerID.Value & _ " </customer>" & _ "</customerorder>"

'Get the <order> element in the XML data island Set docOrder = dsoOrder.XMLDocument

Set nodeOrder = docOrder.selectSingleNode("//order") 'Clone <order> element and add to XML data packet docSubmit.documentElement.appendChild _

nodeOrder.cloneNode(True) 'Display XML data packet in a message box MsgBox docSubmit.xml

End Sub

# Posting Data to the Server

! Instantiating the XMLHTTP Object

! Sending Data to the Server

This section introduces the COM object Microsoft.XMLHTTP, which is used

as a request object to transport XML data to the Web server

Slide Objective

To provide an overview of

the topics in this section

Lead-in

Now that the required XML

data has been prepared and

packaged on the client, it

must be transported back to

the server

Delivery Tip

Tell students that Internet

Explorer 5.0 does not

support https

Instantiating the XMLHTTP Object

! Create a Microsoft.XMLHTTP object

! Open the request, specifying:

Set poster = CreateObject("Microsoft.XMLHTTP")

poster.open "POST", "CustomerOrder.asp", False

Once the XML data packet has been built, it can be sent to the Web server by

using the HTTP Request object

The XML data packet must be transformed into a string of bytes and placed into

either the header or body of the Request object Microsoft® provides a wrapper

COM object named Microsoft.XMLHTTP for this purpose The object has methods and properties for building a Request object from an XML data packet

and sending it to the Web server

Creating the XMLHTTP object The following script shows how to create an XMLHTTP object:

Set poster = CreateObject("Microsoft.XMLHTTP")

The XMLHTTP object has an open method that initializes the Request object

The syntax for the open method is as follows:

poster.open http-method, url, async, userID, password

The open method takes the following five parameters

Parameter Definition

http-method The HTTP method, for example, GET or POST

url The URL that will receive the XML data at the Web server

Typically, this URL specifies an ASP page or a CGI program async A Boolean flag that indicates whether the request is

asynchronous If so, the client will not wait for a response from the server when sending the data If the request is synchronous, the client will wait for the server’s response before continuing userID The user ID, if required for authentication at the Web server password The password, if required for authentication at the Web server

Slide Objective

To create and use an

XMLHTTP object

Lead-in

To post XML data to the

Web server, you must first

create a COM object named

XMLHTTP that provides

methods and properties for

sending the data

Syntax

For example, the following code opens the HTTP connection to post data, asynchronously, to the CustomerOrder.asp page:

poster.open "POST", "CustomerOrder.asp", False

Sending Data to the Server

! Send the XML data

! The readyState property of the Document indicates whether the server has built the Response object

The send method can be synchronous or asynchronous, depending on the value

of the async parameter in the XMLHTTP open method

! Sending data synchronously

If the async parameter is False, the send method is synchronous The send

method blocks until the server finishes processing the request and returns a response to the client

! Sending data asynchronously

If the async parameter is True, the send method is asynchronous The send

method returns immediately, without waiting for a response from the server

Once the XMLHTTP object

has been created and

opened, the next step is to

send the data to the server

by using this object

Syntax

The XMLHTTP object has a readyState property that indicates whether

the server has completed building the response object for the client The

following table list the values for the readyState property

value Description

0 The Response object has been created, but loading has not yet

commenced

1 The document is being loaded

2 The document has been completely loaded, and parsing is underway

3 Some of the document has been parsed, and the data is partially available

to the client

4 The document has been completely parsed and is fully available to the

client

For example, the following script sets up an event handler for the

onreadystatechange event of the XMLDOM object, and uses the readyState

property to determine when the document is completely loaded into memory:

<SCRIPT LANGUAGE=vbscript>

Dim xmldoc Sub cmdLoad_onclick() 'Get XMLDOM object, set up onreadystatechange event handler Set xmldoc = CreateObject("Microsoft.XMLDOM")

xmldoc.onreadystatechange = GetRef("CheckState") 'Load XML document from user-entered URL

xmldoc.load txtURL.value End Sub

'onreadystatechange event handler Function CheckState()

state = xmldoc.readyState results.innerHTML = results.innerHTML & "readyState = " & _ state & "<BR>"

If state = 4 Then

If xmldoc.parseError.errorCode <> 0 Then results.innerHTML = results.innerHTML & _ xmldoc.parseError.reason & "<BR>"

Else results.innerHTML = results.innerHTML & _ "success" & "<BR>"

End If End If End Function

</SCRIPT>

URL: <input type=text size=60 id=txtURL>

<input type=button value=LOAD id=cmdLoad>

<div id=results style="color:red;font-weight:bold;"></div> Later in this module you will learn how to retrieve the response from the server

after it has finished processing the data The XMLHTTP object has various properties, such as responseText and responseXML, which allow the response

to be handled in different ways at the client

the URL of a well-formed

XML document in the URL

text box and click LOAD,

then enter the name of an

invalid XML document and

click LOAD again

Note: Don’t spend a lot of

time on this code It is

advanced

Lab 7.1: Sending XML Packets to the Server

Objectives

After completing this lab, you will be able to:

! Create an XML data packet to send to the server

! Send the XML data packet to the server

Prerequisites

Before working on this lab, you must have:

! Basic knowledge of client-side scripting with Microsoft VBScript

! Familiarity with using object models in VBScript

! Awareness of HTTP request and response mechanisms

Scenario

In this lab, you will write client-side VBScript in a new HTML document named Checkout.htm, to allow the user to submit the order in the shopping basket data island to the LitWare Books Web server

The script will create an XML data packet containing the order details from the shopping basket, and post the data packet to the Web server

Starter and solution files

There are starter and solution files associated with this lab The starter files are

in the folder <install folder>\Labs\Lab07.1\Starter and the solution files for this lab are in the folder <install folder>\Labs\Lab07.1\Solution

Estimated time to complete this lab: 45 minutes

Slide Objective

To introduce the lab

Lead-in

In this lab, you will write

client-side VBScript in a new

HTML document named

Checkout.htm, to allow the

user to submit the order in

the shopping basket data

island to the LitWare Books

Web server

Explain the lab objectives

Exercise 1:

Creating the XML Data Packet

In this exercise, you will add Checkout.htm to the LitWare Books Web site and

link it to the LitWare Books navigation bar

You will then write client-side script in Checkout.htm to create an XML data

packet representing a customer order Upon completion of this exercise, the XML data packet will contain only the customer ID as follows:

<?xml version='1.0'?>

<customerorder>

<customer>customer id</customer>

</customerorder>

! Link Checkout.htm to the LitWare Books Web site

1 Copy the file Checkout.htm from the folder <install folder>\Labs\Lab07.1\Starter to the folder \InetPub\WWWRoot\LitWare

2 Edit NavigateSite.htm on the LitWare Web site

3 Edit the GotoCheckout_OnClick event procedure and replace the “Not

implemented yet” message box with script that populates the main frame with Checkout.htm Use the script in Home_OnClick as a guide

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

4 Save your changes to NavigateSite.htm

5 Test your changes:

a Go to the home page of the LitWare Books Web site and refresh the view

b Click Go to Checkout on the navigation bar

Checkout.htm will be displayed in the main frame of the browser as shown in the following illustration

! Create an XML data packet

1 Open Checkout.htm and familiarize yourself with its contents The document contains a text field where the user can enter a customer ID, and a button for submitting the order to the Web server

2 In the Submit_OnClick event procedure, locate the comment Create XMLDOM object and load XML string

a Create an XMLDOM object and set its async property to False

b Get the customer ID from the txtCustomerID text field and use this

value to build the following XML string:

<?xml version='1.0'?>

<customerorder>

<customer>customer id</customer>

</customerorder>

c Load the XML string into the XMLDOM object

3 Use a message box to verify that the XML data packet was loaded successfully, and that it contains the customer ID as entered in the text field

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

4 Save your changes to Checkout.htm

5 Test your changes:

a Go to the home page of the LitWare Books Web site and refresh the view

b Click Go to Checkout on the navigation bar

c Enter a customer ID The valid customer IDs in the LitWare Books database are 1 to 35

d Click Submit Order A message box should be displayed as follows,

showing the XML data packet with the customer ID

Exercise 2:

Adding the Order Details to the XML Data Packet

In this exercise, you will clone the <order> element in the shopping basket data island, and add order details to the XML data packet

Upon completion of this exercise, the XML data packet will contain all the details necessary to describe the customer order, as shown in the following example:

! Clone the <order> element in the shopping basket data island

1 Open Checkout.htm, and in the Submit_OnClick event procedure locate the comment Clone <order> element in shopping basket data island

2 Define a variable named docOrder and set it to the shopping basket data island in Default.htm You can access this data island by using

top.dsoOrder.XMLDocument

3 Select the <order> element in this data island and clone it (and its

descendent elements) by using the cloneNode method

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

! Add the cloned <order> element to the <customerorder>

1 In the Submit_OnClick event procedure, locate the comment Add <order> element to <customerorder>

2 Select the <customerorder> element in the XML data packet and append the

cloned <order> as a child element by using the appendChild method

3 Use the MsgBox function to verify that the XML data packet contains the

<order> details

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

4 Save your changes to Checkout.htm

5 Test your changes:

a Go to the home page of the LitWare Books Web site and refresh the view

b Order a variety of books

c Click Go to Checkout on the navigation bar

d Enter a valid customer ID, and then click Submit Order

A message box appears showing the XML data packet The data packet should include an <order> element, with details of all the items in the order, as shown in the following illustration

Exercise 3:

Posting the XML Data Packet to the Web Server

In this exercise, you will create an XMLHTTP object and use it to post the

XML data packet to the Web server

You will then create a new ASP page, CustomerOrder.asp, to receive the XML data packet at the Web server and acknowledge receipt of the data with a simple response message

Finally, you will extend NavigateSite.htm so that it allows the user to empty the shopping basket after the order has been submitted

! Post the XML data packet to the Web server

1 Open Checkout.htm, and in the Submit_OnClick event procedure locate the comment Create XML poster object and post XML data to server

b The second parameter is the URL where the XML packet is to be posted

Set this parameter to CustomerOrder.asp

c The third parameter indicates whether or not the response is to be

asynchronous Set this parameter to False

4 Invoke the send method to send the XML data packet located in the

docSubmit object to the Web server

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

5 Save your changes to Checkout.htm

! Create a simple CustomerOrder.asp page

1 Create a new ASP page named CustomerOrder.asp

If you are using Microsoft Visual InterDev®, delete all the template text in the new file except the Language directive

2 Add server-side script to the page in order to write a simple response confirming that CustomerOrder.asp has been called

To see an example of what your page should look like, see Appendix A or the Student CD-ROM

3 Save your changes to CustomerOrder.asp

Note

! Display the server response in the browser

1 Open Checkout.htm and locate the comment Display response from server

2 Using the MsgBox function, display the response text returned from the Web server to the XMLHTTP object

To see an example of what the script should look like, see Appendix A or the Student CD-ROM

3 Save your changes to Checkout.htm

4 Test your changes:

a Go to the home page of the LitWare Books Web site and refresh the view

b Order a variety of books

c Click Go to Checkout on the navigation bar

d Enter a valid customer ID, and then click Submit Order to post the

XML data packet to the Web server

CustomerOrder.asp returns a response message, which is displayed in a message box on the browser as shown in the following illustration

! Empty the shopping basket

1 Open NavigateSite.htm and locate the EmptyBasket_OnClick event

procedure

2 Delete the “Not implemented yet” message box

3 Define a variable and set it to the shopping basket data island in Default.htm You can access the data island by using

top.dsoOrder.XMLDocument

4 Define another variable and set it to the existing <order> element in this data island

5 Use the createElement method to create a new (empty) <order> element

6 Use the replaceChild method of the shopping basket data island to replace

the existing <order> element with the new (empty) <order> element

To see an example of what the event procedure should look like, see Appendix A or the Student CD-ROM

7 Save your changes to NavigateSite.htm

8 Test your changes:

a Go to the home page of the LitWare Books Web site and refresh the view

b Order a variety of books, and then click View Order to view the current

order

c Click Empty Basket, and then click View Order again to verify that the

shopping basket is now empty The main frame should now display an empty order table as follows

# DOM Manipulation on the Server

! Loading XML Data on the Server

! Updating the Database

! Building an HTML Response on the Server

! Building a Static XML Response on the Server

! Building a Dynamic XML Response on the Server

This section discusses the tasks performed on the Web server after it has received the posted data from the client

You will learn how to create an XMLDOM object at the server in order to load

the XML data from the client You will also see how the server can use the data

to perform back-end processing, such as updating database tables

Slide Objective

To provide an overview of

the topics in this section

Lead-in

Now that we have seen how

to post XML data from the

client to the server, let’s see

how this data is retrieved

and processed at the server

Loading XML Data on the Server

! Create an XMLDOM object

! Load the XML data from the Request object

! Access XML data in the XMLDOM object

<%

Set docReceived = CreateObject("Microsoft.XMLDOM")docReceived.async = False

docReceived.load RequestSet rootNode = docReceived.documentElement

%>

When the client sends XML data to the server, it specifies a particular application on the server that will receive and process the data Typically, an ASP page is specified as the recipient The ASP page must retrieve the XML data posted from the client, process the data, and then issue a suitable response

object The following ASP script shows how to load the XML data from the

Request object into the XMLDOM object at the server:

<%

docReceived.async = False docReceived.load Request

Slide Objective

To create an XMLDOM

object on the server

Lead-in

When the client posts XML

data to an ASP at the

server, the server must load

the data into an XMLDOM

object