XML and XSL

XML and XSL

XML (Extensible Markup Language) has the following features.

I Not used to generate layout but to describe data.

I Uses tags to describe di�erent items just as HTML.

I No prede�ned tags, just syntax rules for tags.

I XML uses a DTD (Document Type De�nition) or an XSD (XMLSchema De�nition) to formally describe a grammar for a document.

I Case sensitive.

I All tags must be closed and properly nested.

I All parameter values must be enclosed within apostrophes or quotationmarks.

(2009-10-29 � 1.1 )

An XML document is well formed if it conforms to the XML syntax rules.

An XML document is valid if it is well formed and conforms to the rules inthe corresponding DTD or XSD

(2009-10-29 � 1.2 )

Why use XML?

I It is platform and vendor independent, thus can be easily transportedbetween systems.

I It is designed to describe data, therefore can be used to storedocuments of di�erent kinds.

I It can be translated into other representations such as HTML, PDF.

I It can be read by standard Java and converted into an internal treestructure. Then you can extend and manipulate the tree and write itback to an XML �le.

I O�ce uses the XML format, �les with extension docx are zippedcollections of xml documents.

(2009-10-29 � 1.3 )

Problems?

Not very compact. Takes time to parse large documents.

Alternatives?

JSON is an another document description standard.

(2009-10-29 � 1.4 )

How is XML used in a web application?

I To con�gure the application. The deployment descriptor, web.xml, isan XML document.

I To store data within the application and to exchange data with otherapplications.

I To postpone the design of the View until it used by providing stylesheets. No hardcoded design in the application.

I XSLT is the transformation part of XSL and can be used to produceHTML output from an XML document.

(2009-10-29 � 1.5 )

When using it XML and XSLT (Extendable Stylesheet Language forTransformation) your JSP's merely manages the translations and the actuallayout are described in the style sheets. This means that it is extremelyeasy to modify the layout, just edit the style sheet. No compilation isneeded. Easy to do customized layouts.

It is also possible that your client isn't a browser but something else. Inthat case data can still be translated into a suitable format.

(2009-10-29 � 1.6 )

Basic syntax rules

All tags must be closed,

<a> ... </a>

or

<a ... />

(2009-10-29 � 1.7 )

All elements must be properly nested

<a>

<b>

...

</b>

</a>

not

<a>

<b>

....

</a>

</b>

(2009-10-29 � 1.8 )

There must be a root/start tag.

<c>

<a>

bla bla

</a>

<b>

bla bla

</b>

</c>

(2009-10-29 � 1.9 )

not

<a>

bla bla

</a>

<b>

bla bla

</b>

(2009-10-29 � 1.10 )

An example with a proper header line

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE person><person>

<firstname>Fredrik

</firstname><lastname>

Ålund</lastname><age>

32</age>

</person>

The DOCTYPE is optional but can be used to specify the DTD thatcorresponds to the document type.

(2009-10-29 � 1.11 )

If you want to describe more than one person in the same way you cannotdo,

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE person><person>

<firstname>Fredrik</firstname><lastname>Ålund </lastname><age>32</age>

</person><person>

<firstname>Annika</firstname><lastname>Ålund</lastname><age>28</age>

</person>

Because this violates the rule of one start tag.

(2009-10-29 � 1.12 )

You have to enclose this in an other document root like

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE family><family>

<person><firstname>Fredrik</firstname><lastname>Ålund</lastname><age>32</age>

</person><person>

<firstname>Annika</firstname><lastname>Ålund</lastname><age>28</age>

</person></family>

(2009-10-29 � 1.13 )

Tags can have attributes, that is name-value pairs. The values are enclosedwithin apostrophes or quotation marks.

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE employee><employee department="customer services">

<firstname>Fredrik

</firstname><lastname>

Ålund</lastname><age>

32</age>

</employee>

(2009-10-29 � 1.14 )

The CDATA sections

Sometimes you need to put binary data or special characters (such as >,&, <) in your document. The CDATA (Character Data) allows you to dothat. This means that the data is passed through without interpretation.

E. g.

<element><![CDATA [ 2 < 4 && 4 > 6]]>

</element>

(2009-10-29 � 1.15 )

To navigate in an XML document, you use XPath's.

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE employee><employee department="customer services">

<firstname>Fredrik

</firstname><lastname>

Ålund</lastname><age>

32</age>

</employee>

(2009-10-29 � 1.16 )

The age here is referred as /employee/age

An attribute is referred as /employee/@department

A predicate is something that is true or false.

E. g employee[@department = �customer service�]

Valid ops are =, =!, &lt; , &lt;=, &gt; , &gt;=, and, or

(2009-10-29 � 1.17 )

To translate XML to HTML you use XSLT. You construct stylesheets thatis used for translation.

XSL style sheets are valid XML �les.

They describe the output and the transformation method.

(2009-10-29 � 1.18 )

Assume that we have the following XML-�le:

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE employees><employees>

<employee department="customer services"><firstname>Fredrik</firstname><lastname>Ålund</lastname><age>32</age>

</employee><employee department="customer services">

<firstname>Annika</firstname><lastname>Ålund</lastname><age>32</age>

</employee></employees>

(2009-10-29 � 1.19 )

A style sheet to translate this can be

<?xml version="1.0" encoding="UTF-8" ?><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

<xsl:output method="html"/><xsl:template match="/">

<html><body><table border="3" bgcolor="yellow"><tr>

<th>Name</th><th>Department</th>

</tr><xsl:for-each select="employees/employee">

<tr><td><xsl:value-of select="firstname"/>,<xsl:value-of select="lastname"/></td><td><xsl:value-of select="@department"/></td>

</tr></xsl:for-each>

</table></body></html>

</xsl:template></xsl:stylesheet>

(2009-10-29 � 1.20 )

XSL is a language that operates by matching di�erent patterns to its input,thereby producing output.

This line matches the XPath / in an XML-�le. This is usually a virtualouter layer.

<xsl:template match=�/�>

(2009-10-29 � 1.21 )

Then we have the desired HTML-code that should be produced.

<html><body><table border=�3� bgcolor=�yellow�><tr><th>Name></th><th>Department</th></tr>

(2009-10-29 � 1.22 )

Then we have

<xsl:for-each select=�employees/employee�>

This will iterate through the document and select each employee.

(2009-10-29 � 1.23 )

Followed by

<tr><td><xsl:value-of select=��rstname�/>,<xsl:value-of select=�lastname�/></td><td><xsl:value-of select=�@department�/></td></tr>

These lines will get the value of the name tags and the parameter value forthe current employee. Thus the iteration will walk through the documentand process all employees.

(2009-10-29 � 1.24 )

To use this, you setup a JSP like:

<c:set var="employee_xslt">

<c:import url="employee.xsl"/>

</c:set>

<c:set var="employee_xml">

<c:import url="employee.xml"/>

</c:set>

<x:transform xslt="${employee_xslt}" xml = "${employee_xml}"/>

This sets two variables and then calls the translator. The result is writtento the output.

(2009-10-29 � 1.25 )

Elements in XSL

<xsl:template match=�XPath expression�>....</xsl:template>

Create an XSL template that later can be applied on the parts of the XMLdocument that matches.

<xsl:apply-templates [select = �XPath expression�]/>

Apply the selected templates on all matching parts of your XML �le. If theselect parameter is omitted all templates will be applied.

(2009-10-29 � 1.26 )

<xsl:for-each select = �XPath expression�>...</xsl:for-each>

Iterates over the current scope and processes all matches for the XPathexpression.

<xsl:if match = �XPath predicate�>...</xsl:if>

A conditional statement that test the predicate.

(2009-10-29 � 1.27 )

<xsl:value-of select=�name�/>

Returns the value of the name element

<xsl:value-of select=�@parameter�/>

Returns the value of the parameter. Must be in the current element,otherwise a full XPath must be given.

(2009-10-29 � 1.28 )

<xsl:text disable-output-escaping=�true|false�>text, typical CDATA elements</xsl:text>

Used to output text, mostly CDATA because this will allow specialcharacters to pass through the translations unchanged.

(2009-10-29 � 1.29 )

You cannot have xslt tags inside html tags. Therefore to generate dynamictags, some special methods are needed. This can be anchor tags, inputtags etc.

In such cases you can use the XSL element tag.

<xsl:element name=�name�><xsl:attribute name=�blabla�>value</xsl:attribute>...</xsl:element>

(2009-10-29 � 1.30 )

or just the tag itself, eg <a> or <input>

<name>

<xsl:attribute name="blabla">

value

</xsl:attribute>

...

</name>

(2009-10-29 � 1.31 )

JSTL contains the translators, in the XML tag library, usually pre�xed with"x:�.

<x:transform xml=�xml�le� xslt=�stylesheet�/>

or

<x:transform xslt=�stylesheet�>xml document<x:transform>

(2009-10-29 � 1.32 )

An example. Assume that we have our bookstore with our books. TheJavaBean that loads the data from MySQL tables, produces XML thatdescribes my books. This is just a long string produced by the getXmlmethod in the bean.

(2009-10-29 � 1.33 )

It goes like this:

<booklist><book>

<id>1</id><title>

<![CDATA[BUILDNING SCALABLEAND HIGH-PERFORMANCE JAVAWEB APPLICATIONS USING J2EETECHNOLOGY]]>

</title><authorname><![CDATA[GREG]]></authorname><authorsurname><![CDATA[BARISH]]></authorsurname><price>600</price><pages>392</pages><description>

<![CDATA[A BOOK ABOUT BUILDNING SCALABLE ANDHIGH-PERFORMANCE JAVA WEB APPLICATIONS USING J2EETECHNOLOGY. THE BOOKS DESCRIBES HOW TO USE THEDIFFERENT PARTS OF J2EE TO BUILD A WEB APPLICATION]]>

</description></book><book>

... other books</book>

</booklist>

(2009-10-29 � 1.34 )

This data should be presented like this:

Figure: Output design

(2009-10-29 � 1.35 )

The html for this goes like:

<html><head><title>BookShop::Shop</title></head><body>

<h2>Fredriks Book Shop</h2><table border="0">

<tr cellspacing="0" bgcolor="silver"><td><strong>Book</strong></td><td><strong>Author</strong></td><td><strong>Price</strong></td>

</tr>

(2009-10-29 � 1.36 )

<form action="shop" method="post">

<tr bgcolor="#FFDC75">

<td>BUILDNING SCALABLE AND HIGH-PERFORMANCE JAVA

WEB APPLICATIONS USINGJ2EE TECHNOLOGY</td>

<td>BARISH, GREG</td>

<td>600</td>

<td><input size="2" type="text" value="1" name="quantity"></td>

<td><input value="BUY" type="submit"><a href="shop?action=detail&bookid=1">Detail</a></td>

</tr>

<input type="hidden" value="1" name="bookid">

<input value="add" name="action" type="hidden">

</form>

.....

</table>

</body>

</html>

(2009-10-29 � 1.37 )

To generate this, we have the following JSP

<%@page contentType="text/html;charset=UTF-8" pageEncoding="ISO8859-1"import="se.upright.education.uu.pvk.assignmen.two.beans.*,se.upright.education.uu.pvk.assignmenttwo.tags.*"%><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><%@taglib prefix="x" uri="http://java.sun.com/jsp/jstl/xml"%><%@taglib prefix="bookshop" uri="/bookshop"%><html>

<head><title>BookShop::Shop</title></head><body>

<h2>Fredriks Book Shop</h2><jsp:useBean id="bookList" class="beans.BookListBean" scope="application">

Error, the bean should have been created in the servlet!</jsp:useBean><c:set var="booklist_xslt">

<c:import url="booklist_xslt.xsl"/></c:set><x:transform xslt="${booklist_xslt}">

<jsp:getProperty name="bookList" property="xml"/></x:transform>

</body></html>

(2009-10-29 � 1.38 )

And now all the fun, that is the style sheet.

<?xml version="1.0" encoding="UTF-8" ?><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"><xsl:output method="html"/><xsl:template match="booklist">

<table border="0"><tr bgcolor="silver" cellspacing="0"><td><strong>Book</strong></td><td><strong>Author</strong></td><td><strong>Price</strong></td>

</tr><xsl:apply-templates/>

</table></xsl:template>

(2009-10-29 � 1.39 )

<xsl:template match="book"><form method="post" action="shop">

<tr bgcolor="#FFDC75" ><td><xsl:value-of select="title"/></td><td><xsl:value-of select="authorsurname"/>,

<xsl:value-of select="authorname"/></td><td><xsl:value-of select="price"/></td><td>

<!--A ordinary input in XSLT--><xsl:element name="input">

<xsl:attribute name="size">2</xsl:attribute><xsl:attribute name="type">text</xsl:attribute><xsl:attribute name="value">1</xsl:attribute><xsl:attribute name="name">quantity</xsl:attribute>

</xsl:element></td>

(2009-10-29 � 1.40 )

<td><input type="submit" value="BUY"/><!--A LINK in XSLT--><xsl:element name="a">

<xsl:attribute name="href"><xsl:text disable-output-escaping="yes">

<![CDATA[shop?action=detail&bookid=]]></xsl:text><xsl:value-of select="id"/>

</xsl:attribute><xsl:text>Detail</xsl:text>

</xsl:element></td>

</tr><xsl:element name="input">

<xsl:attribute name="type">hidden</xsl:attribute><xsl:attribute name="value"><xsl:value-of select="id"/></xsl:attribute><xsl:attribute name="name">bookid</xsl:attribute>

</xsl:element><input type="hidden" name="action" value="add"/>

</form></xsl:template>

</xsl:stylesheet>

(2009-10-29 � 1.41 )

We start with the outermost <xsl:template> element. That is implicitlyapplied. This means that it will search for a <booklist> element in theXML data, and that will set my current XPath.

Since we have a booklist tag in the XML data we will get a match andXSLT will start processing this tag.

It will output the html statements that it �nds here. Then there is a<xsl:apply-templates/>

This will cause XSLT to look for all other templates in the style sheet andapply them at the current position. It will �nd the book template, so it willtry to apply this. Since we are in <booklist> it will search for<booklist/book>.

(2009-10-29 � 1.42 )

It will apply the template on the �rst book item. That is, output theHTML form header.

Then it will build the table, �rst inserting the value of booklist/book/titlethen the rest. To produce an input tag that depends on variable data youneed to use a xsl:element tag with the proper parameters, if your input tagis only constants you can output it in HTML.

When all of the book template is �nished, XLST will iterate to see if thereare more matches for it booklist/book. So the template will be applied forall books.

When no more matches are found, XLST will continue in the booklisttemplate again. This will just output the </table> tag and the �nish upbecause this template matches only once.

(2009-10-29 � 1.43 )

An alternative to XML is JSON, Javascript Object Notation. This can beparsed and interpreted using Javascript.

Ex:

{"customers":{"id" : "0","version" : "1","customer" : [

{"firstName" : "Alexis","lastName" : "Midon"

},{

"firstName" : "Sebastien","lastName" : "Auvray"

}]

}}

(2009-10-29 � 1.44 )