XML

XML DSO Examples

In this section, we will create an example that allows a user to view the data stored in a data island in an HTML page using the XML DSO. This example creates a user services component that is contained within Internet Explorer 5 and that performs all the normal movement through records, such as move next, move previous, and so forth. To begin we must create the XML data, a DTD for the XML data, and an HTML page to embed the XML data. We will then need to add DHTML script to the HTML page. The DHTML script works with the DSO and allows the user to move through the records using a Web browser. For this example, you will use the XML data from the BizTalk example in Chapter 12. Create a file called NorthwindPO.xml, and add the following XML data to the file:

  <?xml version="1.0" standalone="no" ?>
  <!DOCTYPE POLines SYSTEM "NorthwindPO.dtd">
  <POLines>
      <Item>
          <line>1</line>
          <partno>pc1010</partno>
          <qty>200</qty>
          <uom>EACH</uom>
          <unitPrice>800.00</unitPrice>
          <discount>10</discount>
          <totalAmount>144000.00</totalAmount>
      </Item>
      <Item>
          <line>1</line>
          <partno>monitor17</partno>
          <qty>200</qty>
          <uom>EACH</uom>
          <unitPrice>300.00</unitPrice>
          <discount>20</discount>
          <totalAmount>48000.00</totalAmount>
      </Item>
  </POLines>

Create a DTD for this XML document called NorthwindPO.dtd with the following declarations:

  <!ELEMENT POLines  (Item+)>
  <!ELEMENT Item  (line , partno , qty , uom , unitPrice ,
                   discount , totalAmount)>
  <!ELEMENT line  (#PCDATA)>
  <!ELEMENT partno  (#PCDATA)>
  <!ELEMENT qty  (#PCDATA)>
  <!ELEMENT uom  (#PCDATA)>
  <!ELEMENT unitPrice  (#PCDATA)>
  <!ELEMENT discount  (#PCDATA)>
  <!ELEMENT totalAmount  (#PCDATA)>

You could also create the following BizTalk schema called NorthwindPO.xsd to validate NorthwindPO.xml:

  <?xml version = "1.0"?>
  <Schema name = "NorthwindPO.xsd"
      xmlns = "urn:schemas-microsoft-com:xml-data"
      xmlns:dt = "urn:schemas-microsoft-com:datatypes">
      <ElementType name = "POLines" content = "eltOnly"
                   order = "seq">
          <element type = "Item" minOccurs = "1" maxOccurs = "*"/>
      </ElementType>
      <ElementType name = "Item" content = "eltOnly" order = "seq">
          <element type = "line"/>
          <element type = "partno"/>
          <element type = "qty"/>
          <element type = "uom"/>
          <element type = "unitPrice"/>
          <element type = "discount"/>
          <element type = "totalAmount"/>
      </ElementType>
      <ElementType name = "line" content = "textOnly"/>
      <ElementType name = "partno" content = "textOnly"/>
      <ElementType name = "qty" content = "textOnly"/>
      <ElementType name = "uom" content = "textOnly"/>
      <ElementType name = "unitPrice" content = "textOnly"/>
      <ElementType name = "discount" content = "textOnly"/>
      <ElementType name = "totalAmount" content = "textOnly"/>
  </Schema>

Notice that the Item element is defined such that it can appear either one time or several times. This is exactly the type of element we want to bind to a table. Once bound to a table, each instance of the Item element will be placed into a row in the table. Let's look at how this can be done.

You can create the following HTML document that uses the XML DSO to render the NorthwindPO.xml XML document in the browser:

  <html>
     <xml src="NorthwindPO.xml" id="NorthwindDSO"></xml>
     <body>
     <table  border="2" width="100%" datasrc="#NorthwindDSO"
            cellpadding="5">
         <thead>
             <th>Line Item</th>
             <th>Part No</th>
             <th>Quantity</th>
             <th>UOM</th>
             <th>Unit Price</th>
             <th>Discount</th>
             <th>Total</th>
         </thead>
         <tbody>
             <tr>
                 <td valign="top"><span datafld="line"></span>
                 </td>
                 <td valign="top"><span datafld="partno"></span>
                 </td>
                 <td valign="top"><span datafld="qty"></span>
                 </td>
                 <td valign="top"><span datafld="uom"></span>
                 </td>
                 <td valign="top"><span datafld="unitprice">
                     </span></td>
                 <td valign="top"><span datafld="discount">
                     </span></td>
                 <td valign="top"><span datafld="totalAmount">
                     </span></td>
             </tr>
         </tbody>
     </table>
     </body>
  </html>

This HTML document will appear as shown in Figure 13-3.

Figure 13-3. NorthwindReturn.htm showing how the XML DSO data binding works.

In this example, you used the xml element to place the XML data in the NorthwindPO.xml XML document into a DSO object called NorthwindDSO. You also bound the table to the NorthwindDSO object using the table element's datasrc attribute. You have accomplished essentially the same task as you did using XSL, except now we are using a technique that currently works with only Internet Explorer 5.

NOTE
Style sheets and other elements could have been included to further improve this example, but they were left out so that you could focus on how the XML DSO data binding works.

We would presume that each line item in the previous code represents items that go together. In this particular example, there was only one line item (a line element equal to 1), which included a computer and a monitor that were sold together. What if there were two line items? If we add the following two Item elements to the NorthwindPO.XML document, the page will look as shown in Figure 13-4 in the Web browser. Add the following to the NorthwindPO.XML document:

  <Item>
      <line>2</line>
      <partno>pc2010</partno>
      <qty>100</qty>
      <uom>EACH</uom>
      <unitPrice>1200.00</unitPrice>
      <discount>10</discount>
      <totalAmount>108000.00</totalAmount>
  </Item>
  <Item>
      <line>2</line>
      <partno>monitor19</partno>
      <qty>100</qty>
      <uom>EACH</uom>
      <unitPrice>500.00</unitPrice>
      <discount>10</discount>
      <totalAmount>45000.00</totalAmount>
  </Item>

Figure 13-4. NorthwindReturn.htm with the two new items.

Although this change is acceptable, you might want to create separate sections for each line item by making some minor changes to the XML document and the DTD. First let's make a few changes to the XML document: add a new element called po and make it the root element of the document; replace the POLines element with the POLine element; move the line element out of the Item element's content and place it within the POLine element. The revised NorthwindPO.XML document now looks as follows:

  <?xml version="1.0" standalone="no" ?>
  <!DOCTYPE po SYSTEM "NorthwindPO2.dtd">
  <po>
      <POLine>
          <line>1</line>
          <Item>
              <partno>pc1010</partno>
              <qty>200</qty>
              <uom>EACH</uom>
              <unitPrice>800.00</unitPrice>
              <discount>10</discount>
              <totalAmount>144000.00</totalAmount>
          </Item>
          <Item>
              <partno>monitor17</partno>
              <qty>200</qty>
              <uom>EACH</uom>
              <unitPrice>300.00</unitPrice>
              <discount>20</discount>
              <totalAmount>48000.00</totalAmount>
          </Item>
      </POLine>
      <POLine>
          <line>2</line>
          <Item>
              <partno>pc2010</partno>
              <qty>100</qty>
              <uom>EACH</uom>
              <unitPrice>1200.00</unitPrice>
              <discount>10</discount>
              <totalAmount>108000.00</totalAmount>
          </Item>
          <Item>
              <partno>monitor19</partno>
              <qty>100</qty>
              <uom>EACH</uom>
              <unitPrice>500.00</unitPrice>
              <discount>10</discount>
              <totalAmount>45000.00</totalAmount>
          </Item>
      </POLine>
   </po>

Next we need to make revisions to the DTD to reflect the changes we made to the XML document. Specifically, delete the declaration for the POLines element and declare two new elements: po and POLine; make POLine the child element of po and declare it to occur one or more times; and make the line element a child element of POLine instead of a child element of Item. The new DTD looks as follows:

  <!ELEMENT po  (POLine+)>
  <!ELEMENT POLine  (line , Item+)>
  <!ELEMENT Item (partno , qty , uom , unitPrice , discount ,
                  totalAmount)>
  <!ELEMENT line  (#PCDATA)>
  <!ELEMENT partno  (#PCDATA)>
  <!ELEMENT qty  (#PCDATA)>
  <!ELEMENT uom  (#PCDATA)>
  <!ELEMENT unitPrice  (#PCDATA)>
  <!ELEMENT discount  (#PCDATA)>
  <!ELEMENT totalAmount  (#PCDATA)>

You can now rewrite NorthwindReturn.htm as follows:

  <html>
  <xml src="NorthwindPO2.xml" id="NorthwindDSO"></xml>
      <body>
          <table  border="2" width="100%" datasrc="#NorthwindDSO"
              cellpadding="5">
              <thead>
                  <th>Line Item</th>
                  <th>Details</th>
              </thead>
              <tbody>
                  <td valign="top"><span datafld="line"></span>
                  </td>
                  <td>
                  <table  border="1" width="100%"
                      datasrc="#NorthwindDSO"
                      datafld="Item" cellpadding="5">
                      <thead>
                          <th>Part No</th>
                          <th>Quantity</th>
                          <th>UOM</th>
                          <th>Unit Price</th>
                          <th>Discount</th>
                          <th>Total</th>
                      </thead>
                      <tbody>
                          <tr>
                              <td valign="top">
                              <span datafld="partno"></span></td>
                              <td valign="top">
                              <span datafld="qty"></span></td>
                              <td valign="top">
                              <span datafld="uom"></span></td>
                              <td valign="top">
                              <span datafld="unitprice"></span>
                              </td>
                              <td valign="top">
                              <span datafld="discount"></span>
                              </td>
                              <td valign="top">
                              <span datafld="totalAmount">
                              </span></td>
                          </tr>
                      </tbody>
                  </table>
                  </td>
              </tbody>
          </table>
      </body>
  </html>

You just created two tables, one nested within the other. The first table uses the element POLine for the repeating element, as this element can occur one or more times. You did not specify the datasrc attribute for the top-level table. The embedded table will need to specify the element that can appear one or more times, which is Item in this example. This document will look as shown in Figure 13-5.

Figure 13-5. NorthwindReturn2.htm with separate line items.

The DSO also presents the XML data it contains as an ADO recordset. A recordset is a table of data in memory. You can use an ADO recordset to programmatically manipulate the data. We will discuss ADO in more detail in Chapter 15. For our purposes in this chapter, we can simply view the ADO recordset as an object that has a set of methods that we will be using. The primary methods we will be looking at are moveFirst, moveLast, movePrevious, moveNext and Fields. After examining how to code these methods, you can easily code additional methods such as delete or addNew. Before we can discuss using these methods, we need to discuss the events associated with the XML DSO.