1. ECA 228 Internet/Intranet Design I XSLT Example

2. ECA 228 Internet/Intranet Design I 2 CSS Limitations cannot modify content cannot insert additional text does not display value of attributes difficult to combine content from more than one document elements can only be formatted one way

3. ECA 228 Internet/Intranet Design I 3 XSL W3C began development in 1998 combination of 3 separate languages – XSLT: transform an XML document into other kinds of documents – XPath: provides a path to XML elements – XSL-FO: implement page layout and design ( not yet supported )

4. ECA 228 Internet/Intranet Design I 4 XSLT create an XSLT stylesheet XSLT is an XML document – name it with.xsl extension converts a source document to a result document transformation on client side or server side

5. ECA 228 Internet/Intranet Design I 5 XSLT cont … very few browsers have built-in support for XSLT – IE5x and NN6 do not fully support the W3C specs – IE6 and NN7 do support the specs client-side processors – XML Spy – MSXML – Saxon – Xalan processors transform XML into actual HTML file

6. ECA 228 Internet/Intranet Design I 6 XSLT cont … link the XML file to the XSLT stylesheet root element of XSLT stylesheet is either or include in the W3C namespace

7. ECA 228 Internet/Intranet Design I 7 XPath each component of an XML document is called a node the entire structure is called a node tree node tree consists of – the XML document itself – comments – processing instructions – namespaces – elements – element text – element attributes

8. 8 XPath node tree: breed_report.xml root (/) element: author element: date text: Michael Barath element: breed_report processing instructions: xml-stylesheet type=“text/xsl” href=“breed_report.xsl” text: 24 November, 2004 element: time text: 08:13 element: breed element: name attribute: img = “papillon.jpg” text: Papillon element:...

9. ECA 228 Internet/Intranet Design I 9 XPath cont … root node ( / ) root node refers to the XML document itself – not the same as the root element of the XML doc relationships between nodes – parent: a node that contains another node – child: node contained by a parent – sibling: nodes that share a common parent – descendent: any node found below another – ancestor: any node above another node

10. ECA 228 Internet/Intranet Design I 10 XPath cont … nodes are distinguished by the object they refer to – element node Papillon – attribute node Papillon – text node Papillon

11. ECA 228 Internet/Intranet Design I 11 XPath cont … XPath provides syntax to reference nodes – absolute – relative relative to context node – any path beginning with a slash ( / ) is absolute standard/general_appearance /breed_report/breed/standard/general_appearance

12. ECA 228 Internet/Intranet Design I 12 XPath cont … Attribute nodes – not technically children of parent argument – syntax uses at ( @ ) sign Text node – the text contained in an element – syntax uses text( ) /breed_report/breed/name/text( ) /breed_report/breed/name/@img

13. ECA 228 Internet/Intranet Design I 13 Root Template template – collection of XSLT elements which tell processor how to transform source document root template – sets up initial code for the result document place the root template at the top of the XSLT document

14. ECA 228 Internet/Intranet Design I 14 Root Template cont … template contains 2 types of content – XSLT elements elements which are part of the XSLT namespace send commands to the processor – literal result elements text sent to result document but not acted on by processor, eg, all HTML tags Breed Results

15. ECA 228 Internet/Intranet Design I 15 Root Template cont … literal result elements – all HTML tags in XSLT document are literal result elements – to use HTML in result document simply add them to root template – any tag which does not start with the xsl namespace prefix ( xsl: ) are treated as literals – all HTML tags must follow strict XML syntax rules

16. ECA 228 Internet/Intranet Design I 16 Root Template cont … AKC Breed Report AKC Breed Report Information by breed

17. ECA 228 Internet/Intranet Design I 17 Output Method most processors output result document as HTML if tag is present in code – not part of the standard to explicitly define output type use the element – formats html xml text

18. ECA 228 Internet/Intranet Design I 18 Output Method cont … attribute include – method – version – encoding – omit-xml-declaration – indent – media-type

19. ECA 228 Internet/Intranet Design I 19 Transforming Source Document 2 ways to view result document – view in browser that contains compliant XSLT processor – use a processor that generates separate HTML file source will no longer be XML, but HTML processors: – XML Spy – Saxon – Apache Xalan – etc

20. ECA 228 Internet/Intranet Design I 20 Inserting Node Value – “select” attribute takes an XPath expression to identify the node ( matches only the first node ) Last Updated: at

21. ECA 228 Internet/Intranet Design I 21 Processing Batch of Nodes to process more than one node – note that the content node has changed from root to “breed_report/breed” – the value of the “select” attribute changes to “name”

22. ECA 228 Internet/Intranet Design I 22 Applying a Template rather than using it is often more efficient to create a template to apply to nodes repeated throughout the document a template to apply to all nodes

23. ECA 228 Internet/Intranet Design I 23 Applying a Template cont … root template: “name” template the content node has changed from “breed_report/breed” to “name” – value of select attribute changes to dot (. )

24. ECA 228 Internet/Intranet Design I 24 Applying a Template cont … to use the “name” template insert the following where it is to be applied, ie, from inside the root template the “name” template will be applied to every node in the document the output from the “name” template will be placed in the result document at the point where references the template

25. ECA 228 Internet/Intranet Design I 25 Applying a Template cont … AKC Breed Report AKC Breed Report Information by breed

26. ECA 228 Internet/Intranet Design I 26 Applying a Template cont … one advantage to using templates is breaking up the source nodes into manageable pieces create a template to process “group” nodes Group:

27. ECA 228 Internet/Intranet Design I 27 Applying a Template cont … apply the template from within the name template because this template is being applied from within the name template, not the root template, “name” is now the context node notice the XPath expression XPath uses../ to move up one level, relative to the context node

28. ECA 228 Internet/Intranet Design I 28 Applying a Template cont … AKC Breed Report AKC Breed Report Information by breed

29. ECA 228 Internet/Intranet Design I 29 Applying a Template cont … continue applying templates as needed to insert content from the source document into the result document General Appearance: Size: Head:

30. ECA 228 Internet/Intranet Design I 30 Attribute nodes XPath reference to reference attribute values uses the at sign ( @ )

31. ECA 228 Internet/Intranet Design I 31 Conditionals process nodes only if certain conditions exist – equal to a certain word – less than or greater than a particular value to run a conditional test against the content of a node …run code if condition is met

32. ECA 228 Internet/Intranet Design I 32 Conditionals cont …

33. ECA 228 Internet/Intranet Design I 33 Conditional Operators OPERATOR REPRESENTS =equal to !=not equal to <less than < =less than or equal to >greater than > =greater than or equal to

34. ECA 228 Internet/Intranet Design I 34 Conditionals cont … xsl:if allows for only one condition to be tested to test for several conditions nested inside xsl:choose, use series of xsl:when to define more than one condition – use as many xsl:when elements as necessary to designate default processing, use xsl:otherwise

35. ECA 228 Internet/Intranet Design I 35 Conditionals cont … year_2002/@rank">

36. ECA 228 Internet/Intranet Design I 36 Sorting by default, nodes are processed in the order in which they appear in the XML document sorting allows you to order them notice the element does not have a separate closing tag can be used inside or

37. ECA 228 Internet/Intranet Design I 37 Sorting cont … uses the select attribute which indicates the node to sort on change original

38. ECA 228 Internet/Intranet Design I 38 Sorting cont … uses several attributes to control sorting attributes select = “expression” data-type = “text | number” order = “ascending | descending” case-order = “upper-first | lower-first”

39. ECA 228 Internet/Intranet Design I 39 Creating Elements if links or paths to images are stored in an XML node, an additional step is required to add them to the result document will cause errors ” />Link ” />

40. ECA 228 Internet/Intranet Design I 40 Creating Elements cont … likewise, using character entities such as < or " will return unexpected results <a href=" &quot />Link</a> <img src="images/ " />

41. ECA 228 Internet/Intranet Design I 41 Creating Elements cont … – takes an attribute, “name”, which has as a value the type of HTML tag to create – takes an attribute, “name”, which has as a value the name of HTML attribute to create <xsl:element name=“img” <xsl:attribute name=“src”

42. ECA 228 Internet/Intranet Design I 42 Creating Elements cont … to create an tag with name/@img as the src, and other appropriate values for other attributes notice the value of the “alt” attribute is set to value of breed_report/breed/name, which was already used earlier in an tag images/ 100 breed_image

43. ECA 228 Internet/Intranet Design I 43 Creating Elements cont … to create links with an tag, as the href the literal “Link to National Club” becomes the actual link in the result document Link to National Club

44. ECA 228 Internet/Intranet Design I 44 Creating Elements cont … to create HTML comments which are inserted into the result document This is a comment