spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column105


Web Services, Part X: Consuming the StockQuote

UNIX Systems Administrator (IL)
Next Step Systems
US-IL-Chicago

Justtechjobs.com Post A Job | Post A Resume
Developer News
OpenOffice 3.2 Lands Amid Critical Changes
Red Hat, IBM Firmly in KVM Virtualization Camp
Red Hat Talks Up Open Source Cloud Plans


Converting the XML Response to HTML

The stock.xsl file transforms the XML quote data to HTML. We create a table with explanatory headings, and populate it with the quote information. We define the table to have a solid border, and the column headings are bold, and underlined. The Last trading data is emphasized by filling its cell with light gray. Here is the table definition in stock.xsl:


<TABLE STYLE="border:1px solid black">
    <TR STYLE="font-size:8pt; font-family:Verdana;
      font-weight:bold; text-decoration:underline">
      <TD>Symbol</TD>
      <TD STYLE="background-color:lightgrey">Last</TD>
      <TD>Date</TD>
      <TD>Time</TD>
      <TD>Chg</TD>
      <TD>Open</TD>
      <TD>High</TD>
      <TD>Low</TD>
      <TD>Vol</TD>
      <TD>MktCap</TD>
      <TD>Prev Close</TD>
      <TD>% Chg</TD>
      <TD>Ann Range</TD>
      <TD>Earns</TD>
      <TD>P-E</TD>
      <TD>Name</TD>
    </TR>

Once the column headings are printed, we need to populate the table with the trade information, one row per symbol. We loop over the three symbols using the for-each construct of XSL:

<xsl:for-each select="//Stock">

The select attribute uses the "//" notation to search for the specified element (<Stock>) starting from the root and down to the leaf cells of the DOMDocument tree.

For each symbol found, we use the value-of construct of XSL to extract the value of each tag and put in the proper cell of the table. Here is the Date statement:

<TD><xsl:value-of select="Date"/<>/TD>

Here is the section that loops over all symbols and prints the quote information:

<xsl:for-each select="//Stock">
  <TR STYLE="font-family:Verdana; font-size:8pt; padding:0px 2px">
    <TD><xsl:value-of select="Symbol" /></TD>
    <TD STYLE="background-color:lightgrey">
      <xsl:value-of select="Last" /></TD>
    <TD><xsl:value-of select="Date" /></TD>
    <TD><xsl:value-of select="Time" /></TD>
    <TD><xsl:value-of select="Change" /></TD>
    <TD><xsl:value-of select="Open" /></TD>
    <TD><xsl:value-of select="High" /></TD>
    <TD><xsl:value-of select="Low" /></TD>
    <TD><xsl:value-of select="Volume" /></TD>
    <TD><xsl:value-of select="MktCap" /></TD>
    <TD><xsl:value-of select="PrevClose" /></TD>
    <TD><xsl:value-of select="PctChg" /></TD>
    <TD><xsl:value-of select="AnnRange" /></TD>
    <TD><xsl:value-of select="Earns" /></TD>
    <TD><xsl:value-of select="P-E" /></TD>
    <TD><xsl:value-of select="Name" /></TD>
  </TR>
</xsl:for-each>

Here is the full listing of stock.xsl:

<?xml version='1.0'?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  version="1.0" >
<xsl:output method="html"/>
<xsl:template match="/*">
<html>
  <TABLE STYLE="border:1px solid black">
    <TR STYLE="font-size:8pt; font-family:Verdana; font-weight:bold;
      text-decoration:underline">
      <TD>Symbol</TD>
      <TD STYLE="background-color:lightgrey">Last</TD>
      <TD>Date</TD>
      <TD>Time</TD>
      <TD>Chg</TD>
      <TD>Open</TD>
      <TD>High</TD>
      <TD>Low</TD>
      <TD>Vol</TD>
      <TD>MktCap</TD>
      <TD>Prev Close</TD>
      <TD>% Chg</TD>
      <TD>Ann Range</TD>
      <TD>Earns</TD>
      <TD>P-E</TD>
      <TD>Name</TD>
    </TR>
    <xsl:for-each select="//Stock">
      <TR STYLE="font-family:Verdana; font-size:8pt; padding:0px 2px">
        <TD><xsl:value-of select="Symbol" /></TD>
        <TD STYLE="background-color:lightgrey">
          <xsl:value-of select="Last" /></TD>
        <TD ><xsl:value-of select="Date" /></TD>
        <TD><xsl:value-of select="Time" /></TD>
        <TD><xsl:value-of select="Change" /></TD>
        <TD><xsl:value-of select="Open" /></TD>
        <TD><xsl:value-of select="High" /></TD>
        <TD><xsl:value-of select="Low" /></TD>
        <TD><xsl:value-of select="Volume" /></TD>
        <TD><xsl:value-of select="MktCap" /></TD>
        <TD><xsl:value-of select="PrevClose" /></TD>
        <TD><xsl:value-of select="PctChg" /></TD>
        <TD><xsl:value-of select="AnnRange" /></TD>
        <TD><xsl:value-of select="Earns" /></TD>
        <TD><xsl:value-of select="P-E" /></TD>
        <TD><xsl:value-of select="Name" /></TD>
      </TR>
    </xsl:for-each>
  </TABLE>
</html>
</xsl:template>
</xsl:stylesheet>


Next: A Final Word

http://www.internet.com


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Installing and Using Meeplace, the Business Review CMS · Sending an HTML and Plain Text E-newsletter with ASP.NET, Part 2 · Create Multilingual Web Sites with Windows Unicode Fonts
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
MySql View Technique for Grouping Crosstab Column Data · Why You Need a Mobile Web Site · Tame Web Marketing with Social Media Management


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: March 11, 2002
Revised: March 11, 2002

URL: http://www.webreference.com/js/column105/6.html