- Preface
- Introduction
- A Sample Program
- The XML File
- The XSLT File
- The Output
- Complete Program Listings
Preface
I have authored numerous online articles on XML. These articles cover the range from introductory to advanced topics. I maintain a consolidated index of hyperlinks to all of my XML articles at my personal website so that you can access earlier articles from there.
Rendering XML documents
As of this writing, Microsoft IE5 is the only widely-used web browser that has the ability to render XML documents. IE5 can render XML documents using either CSS (see my personal website) or XSL.
This is one in a series of articles that discuss the use of XSL for the rendering of XML documents, with particular emphasis on the use of IE5 for that purpose.
Introduction
In a previous article, I showed you how to use the
xsl:for-each |
xsl:value-of |
xsl:template |
The program was simple. In order to keep the program as simple as possible, I minimized the use of HTML code. As a result, the program didn’t do anything useful.
Make it useful
Now I am going to go back and upgrade that program into one that could be useful. In particular, I am going to loop through a series of XML elements and cause the contents of those elements to be deposited in an HTML table.
A Sample Program
In this lesson, I will develop the XML code representing a small database of information on books. In addition, I will develop the corresponding XSLT code required to process that database.
I will also show you how to use IE5 to transform the data in the XML database to HTML according to the XSLT. When you load the XML file into IE5, the XML will be converted into an HTML table and displayed in the browser window. Alternately, you can load the XML file and the XSLT file into the XSL Debugger discussed in an earlier lesson and get essentially the same result.
This example is based on XSLT information available at the W3C and on IE5 information available at Microsoft.
The XML File
The XML file is named XSL003.xml. I am purposely skipping the preliminary material at the top, such as the xml version tag and the xml-stylesheet tag. You have seen that code before, and there is nothing new there.
The first element is simply:
Following that element are the data elements:
Java
R.Baldwin
The XML file shows the first of several elements named
theData</font> |
As you can see, the contents of an element named
theData</font> |
title </font>
author </font>
price </font>
What are the contents of these elements? The actual data value associated with that element. Here’s some more of the XML file:
This shows two another element named
theData</font> |
top</font> |
The XSLT File
This file is named XSL003.xsl. It shows how to use XSLT to transform the contents of a simple XML database into an HTML table.
I will also discuss this XSLT file in fragments. A complete listing of the file is presented near the end of the lesson.
The following code shows the preliminary material at the beginning of the file. I discussed this material in detail in a previous lesson, and won’t repeat that discussion here.
M
Create an HTML table
You will recall, any literal text that is not inside a processing element is simply passed through and inserted into the output. This code shows some of the literal text necessary to create an HTML table. If you don’t know the purpose of these attributes of an HTML table element, I’m sure that you can find that information at dozens of places on the web.
Title | Author | Price |
xsl:for-each |
At the beginning of each iteration, the code creates a new row in the table using an HTML <tr> element. For each row, it uses three successive xsl:value-of processing elements to extract the contents of the three elements named title, author, and price.
Insert each content value into a table cell
The contents of each XML element are inserted into a cell in the HTML row by wrapping them in an HTML table data element indicated by <td>. Then the entire populated row of HTML text is inserted into the output text stream.
Cleanup time again
Finally, here are the ending tags for the HTML elements that are being created as well as the ending tags for the XSLT template and stylesheet elements:
Now let’s look at some output.
The Output
If you load this XML file into your IE5 browser, you should see something very similar to the following in the browser window:
Title | Author | Price |
Java | R.Baldwin | $9.95 |
Python | R.Baldwin | $15.42 |
XML | R.Baldwin | $19.60 |
So there you have it. The use of an XSLT file to transform the contents of a simple XML database into an HTML table.
Complete Program Listings
A complete listing of the XML file is shown below, followed by a complete listing of the XSLT file. Copyright 2000, Richard G. Baldwin. Reproduction in whole or in part in any form or medium without express written permission from Richard Baldwin is prohibited.
XML
XSLT
Title | Author | Price |
About the author: Richard Baldwin is a college professor and private consultant whose primary focus is a combination of Java and XML. In addition to the many platform-independent benefits of Java applications, he believes that a combination of Java and XML will become the primary driving force in the delivery of structured information on the Web.
Richard has participated in numerous consulting projects involving Java, XML, or a combination of the two. He frequently provides onsite Java and/or XML training at the high-tech companies located in and around Austin, Texas. He is the author of Baldwin’s Java Programming Tutorials, which has gained a worldwide following among experienced and aspiring Java programmers. He has also published articles on Java Programming in Java Pro magazine.
Richard holds an MSEE degree from Southern Methodist University and has many years of experience in the application of computer technology to real-world problems.