Using XSL Stylesheets to Translate XML into HTML, Part 3By Arno Jansen
In Part 2 we examined the full XSL stylesheet. In this third and final part of this article, we will look at extending the stylesheet to provide more options for our HTML output...
Now suppose we want the message to be displayed using another font, e.g. Arial, we can put in the plain HTML
for it (
<FONT FACE="arial">), but we can also create it using XSL, which is preferred in
some more complex ways. First we have to create the element itself:
Then, we add the
FACE attribute to it:
Now we want the message text to appear:
And finally, we have to close the element tag again:
Now, the whole template for the message tag will be:
Now, translating to an HTML form is not all that different, the main difference is in the template that treats
the memo tag. This template will have to write out not only an HTML header and footer, but also open and close
the form. In between the opening and closing tags of the form will be the
tag. Let's have a look at the template for the memo tag:
As you can see, it is mostly just HTML that's put in there. Please be aware of the fact that all the "empty"
tags (the ones that do not have a separate closing tag) end with
/> instead of just the
<INPUT ... /> instead of
<INPUT ... >)
There is also an extra textbox so that the user can enter a filename and later save the file with that name.
Now, similar to this we can translage the other tags in the XML document into HTML form objects. For the FROM,
TO and SUBJECT I chose to use a normal textbox. Basically this is the same for all three tags, so I'll explain
just the FROM tag.
Again, we use a normal XSL template tag. This time with a match pattern for the FROM tag. And once in there we
want to create a textbox with the name "from" and the value must be the text between the
</FROM> tags in the XML file. So we have to create an
element with the name "input" and two attributes, one "name" attribute and one "value" attribute. And here is
how we do that:
As you can see, this is not rocket science but there are a few things we have to keep an eye on. First thing
is to make sure not only open the
<xsl:element> tag, but also close it. Second is that
everything between a
</xsl:attribute> becomes the value of the attribute.
So when we create the name attribute, we give it the value "from". Most tricky part here is the third attribute,
the value attribute. Between the opening and closing tag of that attribute, we select the value of the current
node, which is the text of the message tag, so that the textbox will be filled with the text from the file
when it appears on screen. That whole template will translate into this in the HTML:
Again, we can see the forward slash before the closing bracket. That is how the stylesheets translate the memo into HTML. Now, which stylesheet we pick depends on a parameter that is passed to an ASP file that will parse both the XML document and one of the two stylesheets, but more on that in the main article.