XML - Lesson 6

Displaying Data with XSLT
Objectives
In this lesson, you will learn to:
☛ Perform conditional formatting in a style sheet
☛ Use XPath pattern matching in a style sheet
☛ Create a comma-separated list of values
☛ Import a style sheet in another style sheet
©NIIT eXtensible Markup Language/Lesson 6/Slide 1 of 45

Problem Statement 6.D.1

A list of products sold at CyberShoppe needs to be displayed.
These products need to be categorized based on their prices.
The details about products priced higher than $50 are to be
displayed in red and the rest are to be displayed in green.
The details to be displayed include the product name,
description, price, and quantity on hand.

Task List
☛ Identify data to be displayed.
☛ Identify the elements required to format data based on
a condition.
☛ Create a style sheet to format data based on a
condition.
☛ Apply the style sheet to the XML document.
☛ View the XML document.

Task 1: Identify data to be displayed.

Result
☛ As per the scenario, the data that has to be displayed is as
follows:
✓ PRODUCTNAME
✓ DESCRIPTION
✓ PRICE
✓ QUANTITY

Task 2: Identify the elements required to format data

based on a condition.
The if Element
☛ The if element provides a simple if-then construct. The
syntax of if element is as follows:
<xsl:if test=“condition”>
[actions to be performed if the condition
is true]
</xsl:if>

Task 2: Identify the elements …a condition. (Contd.)

The choose Element
☛ The choose element is used to make a choice when there
are two or more possible courses of action.
☛ It provides a means for testing multiple conditions.

Task 2: Identify the elements …a condition.

(Contd.)
☛ The syntax of the choose element is as follows:
<xsl:choose>
<xsl:when test="condition">
[action to be taken]
</xsl:when>
:
:
<xsl:otherwise>
[action to be taken]
</xsl:otherwise>
</xsl:choose>
Task 2: Identify the elements …a condition. (Contd.)

☛ The following table lists the comparison and boolean
operators that can be used with the xsl:choose and xsl:if
elements:
Operator Meaning Example
= Equal to PRICE[. = 20]
PRODUCTNAME[. = ‘Mini Bus’]
!= Not equal to PRICE[. != 20]
PRODUCTNAME[. != ‘Barbie Doll’]
< Less than PRICE[. < 20]
> Greater than PRICE[. > 20]
<= Less than or equal to PRICE[. <= 20]
>= Greater than or equal to PRICE[. >= 20]

Task 2: Identify the elements … a condition. (Contd.)
Operator Meaning Example

and Logical AND PRICE[. &gt 20 and . < 30]
or Logical OR PRICE[. = 20 or . = 45]
not Negation operator PRICE[not(. = 30)]
The operators given in bold in the above list are Microsoft extensions to the
original list of operators recommended by W3C.

Task 2: Identify the elements … a condition.

(Contd.)
Result
☛ As the value of the PRICE element needs to be checked
for a range of values, the choose element in combination
with when and otherwise can be used for performing
the check.

Task 3: Create a style sheet to format data based

on a condition.
Task 4: Apply the style sheet to the XML document.
Task 5: View the XML document.

Just a Minute…
The details about the books sold at CyberShoppe need to
be displayed. Books priced higher than $100 are to be
displayed in red, those priced higher than $75 are to be
displayed in blue, and the rest are to be displayed in
green.


CyberShoppe needs to display a summarized report about
orders. The data about the products and all orders placed
for products is stored in an XML document. This data
includes the details about a product, such as product ID,
product name, and price per unit. For each product, the data
about all orders placed against that product is also stored.
This data includes the order number, shipping address, and
the order quantity.

Problem Statement 6.D.2 (Contd.)

The structure of the XML document is given below:
SUMMARY
PRODUCT
ORDER
SHIPPING
ADDRESS
QUANTITY

Task List
☛ Identify the data to be displayed.
☛ Identify a mechanism to display summarized data.
☛ Identify the XPath expressions required for performing
calculations.
☛ Identify the functions required for performing
calculations.
☛ Create an XSLT style sheet containing XPath patterns
and functions.
☛ Create the XML document.

Task 1: Identify the data to be displayed.

Result
☛ As per the given scenario, the details to be displayed are
as follows:
✓ Product ID
✓ Product Name
✓ Price per unit
✓ Details about orders placed against the product:
➤ Order number
➤ Shipping address
➤ Total quantity
➤ Order value
✓ Total sales amount for the product
Task 2: Identify a mechanism to display summarized

data.
☛ XML Path (XPath) language is used for searching and
retrieving information from an XML file.
☛ XPath treats an XML document as a tree of interrelated
branches and nodes.
☛ A node can be of any type, such as an element, attribute,
processing instruction (PI), comment, text, or namespace.
☛ XPath provides a set of expressions and functions that can
be used for matching nodes in an XML document. As a
result of matching nodes with a specific pattern, a set of
nodes referred to as node set is retrieved.

Task 2: Identify a … summarized data. (Contd.)

Result
☛ As XPath provides a set of expressions and functions that
can match specific patterns, retrieve results, and perform
additional operations such as calculations, XPath can be
used along with XSLT for displaying data in the given
scenario.

Task 3: Identify the XPath expressions required for
performing calculations.
☛ XPath expressions can be used to retrieve data based on
specific conditions. You can apply constraints by adding a
filter clause, which is otherwise referred to as a filter
pattern.
☛ Using XPath, you can create expressions that can identify
the nodes in an XML document based on names and
values. You can also create expressions that identify the
relationship of a node with other nodes in the document.
These expressions can be used with XSLT patterns for
matching and retrieving nodes.
☛ XPath expressions work on the basis of a specific context.
☛ XPath expressions can be created using a set of operators
and special characters. The following table describes these
operators:
Task 3: Identify the … performing calculations.

(Contd.)
Operator/ Example Description
Special
Character
/ /PRODUCTDATA Selects immediate child elements of PRODUCTDATA. If this
operator occurs at the start of the pattern, it indicates that the
child elements should be selected from the root node.
// //PRODUCTNAME Searches for the specified element at any node level.
. .PRODUCTNAME Indicates the current context.
* * Selects all elements regardless of the element name.
@ @PRODUCTID Used as a prefix for the attribute PRODUCTID.


(Contd.)
Special
Character
@* @* Selects all attributes, regardless of the name.
: : Separates the namespace prefix from the element or

attribute name.
() (PRICE*QUANTITY) Used to group operations.
[] [@PRODUCTID='P001'] Applies a filter pattern.
+ num1 + num2 Adds two numbers, returning their sum.
- num1 - num2 Subtracts num2 from num1, returning the difference.

Task 3: Identify the …performing calculations.

(Contd.)

Special
Character
* num1 * num2 Multiplies num1 by num2, returning the product.
div num1 div num2 Divides num1 by num2, returning the quotient.
mod num1 mod num2 Returns the modulus—that is, divides num1 by num2 and
returns the remainder.
.. ../PRODUCTNAME Selects the PRODUCTNAME element, which exists within
the parent of the current element.


(Contd.)
Result
☛ In the given scenario, an XPath expression can be created
for calculating the order value:
<xsl:value-of select='(../@PRICE) *
(QUANTITY)'/>
☛ The above expression instructs the XSLT processor to pick
up the value of the PRICE attribute of the parent element
and multiply it by the value of the QUANTITY element.

Task 4: Identify the functions required for performing

calculations.
XPath functions
☛ XPath provides a various categories of functions. They are:
✓ string
✓ node set
✓ boolean
✓ number
☛ These functions can take one or more arguments.

Task 4: Identify the ... performing calculations.

(Contd.)
String functions
☛ The string functions of XPath are used to perform string
operations, such as finding the length of a string or
converting a string from uppercase to lowercase.
☛ Some of the string functions provided in XPath are:
✓ string(obj?): Converts the argument to a string value.
✓ starts-with(str, str): Returns true if the first string begins
with the second string
✓ contains(str, str): Returns true if the first string contains
the second string.


(Contd.)
String functions (Contd.)
✓ substring(str, num, num?): Returns a portion of the
string starting from the position specified in the second
argument. Returns the number of characters specified in
the third argument.
✓ substring-before(str, str): Returns the portion of the first
string that precedes the second string.
✓ substring-after(str, str): Returns the portion of the first
string that follows the second string.
✓ string-length(str?): Returns the length of the string.


(Contd.)
Node-Set functions
☛ Node-set functions are used to manipulate node sets or to
return information about node sets.
☛ Some of the node-set functions provided in XPath are:
✓ last(): Returns the number of the last node in the current
node-set.
✓ position(): Returns the position of the current node
within the parent node.
✓ count(ns): Returns the number of occurrences of the
specified node-set.
✓ id(obj): Returns the element with the specified unique
ID.


(Contd.)
Boolean functions
☛ All boolean functions return either true or false.
☛ Some of the node-set functions provided in XPath are:
✓ boolean(obj?): Converts the argument to a boolean.
✓ not(boolean): Takes an expression, which returns a
boolean value, as its argument. Negates the result of
the Boolean expression.


(Contd.)
Numeric functions
☛ XPath provides numeric functions for various purposes,
such as adding numbers, finding the nearest integer value,
and converting strings to numbers.
☛ Some of the numeric function provided in XPath are:
✓ number(obj?): Converts the argument to a number.
✓ sum(ns): Sums up the values of the nodes contained in
the node-set, which is passed as an argument to the
function.
✓ floor(num): Returns the largest integer that is less than
or equal to the argument.
✓ ceiling(num): Returns the smallest integer that is greater
than or equal to the argument.
(Contd.)
✓ round(num): Rounds up the number to the nearest
integer.
Result
☛ As per the scenario, the sum() function of XPath needs to
be used for calculating the product sales value of each
product. The code for calculating the product sales values
is given as follows:
<xsl:value-of select='(../@PRICE) *
(QUANTITY)'/>
<xsl:value-of select='(./@PRICE) *
sum(./ORDER/QUANTITY)'/>

Task 5: Create an XSLT style sheet containing XPath
patterns and functions.
Task 6: Create the XML document.
Task 7: View the XML document.


The details about the books that are available for sale at
CyberShoppe are stored in an XML document. The book
details, such as book ID, title, rate, author first name, and
author last name should be displayed in a tabular format.
The first name and last name of an author should be
displayed in a single column, "AUTHOR(S)". If a book has
multiple authors, their names should be displayed as
comma-separated values.

Task List
☛ Identify the data to be displayed.
☛ Identify a mechanism to be used to display the data in
a tabular format.
☛ Identify the elements required to display data in a
tabular format.
☛ Identify a mechanism to create a comma-separated
list of values.
☛ Create a style sheet.
☛ Apply the style sheet to the XML document.

Task 1: Identify the data to be displayed.

Result
In the given scenario, the data to be displayed is as
follows:
☛ BOOKID
☛ TITLE
☛ RATE
☛ AUTHOR
✓FIRSTNAME
✓LASTNAME

Task 2: Identify a mechanism to be used to display

the data in a tabular format.
☛ Information pertaining to the way in which XML data must
appear in a browser is specified in either CSS or XSLT
style sheets.
☛ However, in certain situations, these two methods do not
have the capability to display data in certain formats.
☛ You can combine the features of HTML and XSLT to format
the data from an XML document as per requirements.

Task 2: Identify a mechanism …the data in a tabular

format. (Contd.)
Result:
☛ In the given scenario, HTML tags can be used in an XSLT
to display data in a tabular format.

Task 3: Identify the elements required to display data

in a tabular format.
Using HTML Elements in an XSLT Style Sheet
☛ In order to use HTML tags in an XSLT style sheet, you
must write the HTML code to display the data in the desired
format.
☛ This code is then embedded in the XSLT document.

Task 3: Identify the …in a tabular format. (Contd.)
Result:
☛ In the given scenario, you can use the TABLE, TR, TH, and
TD elements in an XSLT style sheet to display data in a
tabular format.

Task 4: Identify a mechanism to create a comma-

separated list of values.
Result
☛ In order to create a comma-separated list of values, you
can use either the template or the for-each element.

Task 5:Create a style sheet.
Task 6:Apply the style sheet to the XML

document.
Task 7:View the XML document.

Problem Statement 6.P.1

The details about suppliers who supply various products to
CyberShoppe need to be displayed in a tabular format.
Supplier details include supplier ID, first name, last name,
address, phone number, and various products supplied by
them. A supplier may supply one or more products. The
names of all products supplied by a supplier must be
displayed in a single column in the form of a
comma-separated list. The details in every alternate row in
the table must be displayed in red.
Hint: Use the mod operator of XPath for checking for an
alternate row.

Creating Nested Style Sheets

The import Element
☛ The import element is an element supported by XSLT in
which one XSLT style sheet can be reused by another
XSLT style sheet.
☛ The general form of the import element is as follows:
<xsl:import href="location"/>
☛ The import element is a top level element that must appear
immediately after the stylesheet element.

Summary
In this lesson, you learned that:
☛ There are two elements in XSLT that allow you to format
data based on a condition. They are if and choose.
☛ The if element provides a simple if-then construct. It has
a single test attribute, which specifies the criteria for
performing an action.
☛ The choose element selects one from a number of
possible alternatives. It consists of a number of when
elements followed by an optional otherwise element.
☛ XPath is a language used for searching and retrieving
information from an XML document.
☛ The primary purpose of XPath is to address parts of an
XML document, and manipulate strings, numbers, and
boolean values.
Summary (Contd.)
☛ XPath expressions can match specific patterns, retrieve
results, and perform additional operations relative to the
context of the returned nodes.
☛ XPath provides functions, which can be categorized as
follows:
✓ String functions: Used for basic string operations, such
as finding a string's length or changing a string from
uppercase to lowercase.
✓ Node-set functions: Used to manipulate node sets or
return information about node sets.
✓ Boolean functions: Return either true or false based on
the argument passed to the function.
✓ Numeric functions: Used to perform calculations on
numeric values.
Summary (Contd.)
☛ You can use HTML code in an XSLT style sheet to display
data in different formats.
☛ The import element is used to import an XSLT style
sheet to another XSLT style sheet.

XML - Lesson 6

Enviado por

Dados do documento

Descrição original:

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

XML - Lesson 6

Enviado por

Direitos autorais:

Formatos disponíveis

Displaying Data with XSLT

©NIIT eXtensible Markup Language/Lesson 6/Slide 1 of 45

Problem Statement 6.D.1

©NIIT eXtensible Markup Language/Lesson 6/Slide 2 of 45

©NIIT eXtensible Markup Language/Lesson 6/Slide 3 of 45

Task 1: Identify data to be displayed.

©NIIT eXtensible Markup Language/Lesson 6/Slide 4 of 45

Task 2: Identify the elements required to format data

©NIIT eXtensible Markup Language/Lesson 6/Slide 5 of 45

Task 2: Identify the elements …a condition. (Contd.)

©NIIT eXtensible Markup Language/Lesson 6/Slide 6 of 45

Task 2: Identify the elements …a condition.

Task 2: Identify the elements …a condition. (Contd.)

&gt; Greater than PRICE[. &gt; 20]

&lt;= Less than or equal to PRICE[. &lt;= 20]

&gt;= Greater than or equal to PRICE[. &gt;= 20]

©NIIT eXtensible Markup Language/Lesson 6/Slide 8 of 45

Task 2: Identify the elements … a condition. (Contd.)

Operator Meaning Example

or Logical OR PRICE[. = 20 or . = 45]

not Negation operator PRICE[not(. = 30)]

©NIIT eXtensible Markup Language/Lesson 6/Slide 9 of 45

Task 2: Identify the elements … a condition.

©NIIT eXtensible Markup Language/Lesson 6/Slide 10 of 45

Task 3: Create a style sheet to format data based

Task 4: Apply the style sheet to the XML document.

Task 5: View the XML document.

©NIIT eXtensible Markup Language/Lesson 6/Slide 11 of 45

©NIIT eXtensible Markup Language/Lesson 6/Slide 12 of 45

Problem Statement 6.D.2

©NIIT eXtensible Markup Language/Lesson 6/Slide 13 of 45

Problem Statement 6.D.2 (Contd.)

©NIIT eXtensible Markup Language/Lesson 6/Slide 14 of 45

©NIIT eXtensible Markup Language/Lesson 6/Slide 15 of 45

Task 1: Identify the data to be displayed.

Task 2: Identify a mechanism to display summarized

©NIIT eXtensible Markup Language/Lesson 6/Slide 17 of 45

Task 2: Identify a … summarized data. (Contd.)

©NIIT eXtensible Markup Language/Lesson 6/Slide 18 of 45

Task 3: Identify the … performing calculations.

// //PRODUCTNAME Searches for the specified element at any node level.

. .PRODUCTNAME Indicates the current context.

* * Selects all elements regardless of the element name.

@ @PRODUCTID Used as a prefix for the attribute PRODUCTID.

©NIIT eXtensible Markup Language/Lesson 6/Slide 20 of 45

Task 3: Identify the … performing calculations.

: : Separates the namespace prefix from the element or

() (PRICE*QUANTITY) Used to group operations.

[] [@PRODUCTID='P001'] Applies a filter pattern.

+ num1 + num2 Adds two numbers, returning their sum.

- num1 - num2 Subtracts num2 from num1, returning the difference.

©NIIT eXtensible Markup Language/Lesson 6/Slide 21 of 45

Task 3: Identify the …performing calculations.

Operator/ Example Description

©NIIT eXtensible Markup Language/Lesson 6/Slide 22 of 45

Task 3: Identify the … performing calculations.

©NIIT eXtensible Markup Language/Lesson 6/Slide 23 of 45

Task 4: Identify the functions required for performing

©NIIT eXtensible Markup Language/Lesson 6/Slide 24 of 45

Task 4: Identify the ... performing calculations.

©NIIT eXtensible Markup Language/Lesson 6/Slide 25 of 45

Task 4: Identify the … performing calculations.

©NIIT eXtensible Markup Language/Lesson 6/Slide 26 of 45

> Greater than PRICE[. > 20]

<= Less than or equal to PRICE[. <= 20]

>= Greater than or equal to PRICE[. >= 20]