XML – Display and Manipulate Using XSLT in C#

XML (Extensible Markup Language) is one of the data sources which contains data. We can bind XML data source to many C# data controls, or we can display XML data in specified HTML format. Extensible Stylesheet Language Transformation (XSLT) used to display XML in specified format through HTML. We can use XSLT not only to view the XML data, and also we can fetch only specific data from XML by applying specific validations. That means XSLT used to display and format the XML data. Here we discuss how to display and format the XML by using XSLT in C# Asp.Net.

Open Microsoft Visual Studio 2015 => Create Asp.Net Web Application and name it as CSharpXMLXSLT.

Add new XML file and XSLT files to the project as shown below.

Employees.XML

<?xml version="1.0" encoding="utf-8" ?>

<Employees>

  <Employee Id="10001">

    <Name>Jake</Name>

    <Salary>20000</Salary>

    <Location>Houston</Location>

  </Employee>

  <Employee Id="10002">

    <Name>Bob</Name>

    <Salary>40000</Salary>

    <Location>London</Location>

  </Employee>

  <Employee Id="10003">

    <Name>Raj</Name>

    <Salary>80000</Salary>

    <Location>London</Location>

  </Employee>

  <Employee Id="10004">

    <Name>John</Name>

    <Salary>10000</Salary>

    <Location>Paris</Location>

  </Employee>

  <Employee Id="10005">

    <Name>David</Name>

    <Salary>20000</Salary>

    <Location>London</Location>

  </Employee>

</Employees>

Employees.XSLT

<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">

  <xsl:template match="/">

    <table border="1px" style="border-collapse:collapse">

      <tr>

        <th>Id</th>

        <th>Name</th>

        <th>Salary</th>

        <th>Location</th>

      </tr>

      <xsl:for-each select='Employees/Employee'>

        <tr>

          <td>

            <xsl:value-of select='@Id'/>

          </td>

          <td>

            <xsl:value-of select='Name'/>

          </td>

          <td>

            <xsl:value-of select='Salary'/>

          </td>

          <td>

            <xsl:value-of select='Location'/>

          </td>

        </tr>

      </xsl:for-each>

    </table>

  </xsl:template>

</xsl:stylesheet> 

As shown above Employees.xml contains Employees data and Employees.xslt contains html content to display the Employees data. If we observer Employees.xslt we are using <xsl:template, <xsl:for-each, and <xsl:value-of xslt tags. <xsl:template used as root tag to read from the start of the XML file.  <xsl:for-each is used to loop through XML content, here <xsl:for-each select='Employees/Employee'> used to loop through all Employee tags. <xsl:value-of tag used to fetch the XML element data. Here <xsl:value-of select='@Id'/> used to display the Employee tag Id attribute data as we are using @ symbol before name of the element and <xsl:value-of select='Name'/>, <xsl:value-of select='Salary'/>, and <xsl:value-of select='Location'/> used to fetch Employee Name, Salary, and Location.

Now we have to bind this Employees.XML and Employees.xslt files to Asp.Net XML controls as shown below.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="CSharpXMLXSLT.WebForm1" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <asp:Xml ID="xml1" runat="server"></asp:Xml>     

    </div>

    </form>

</body>

</html>

using System;

namespace CSharpXMLXSLT

{

    public partial class WebForm1 : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            BindEmployeeData();

        } 

        private void BindEmployeeData()

        {

            xml1.DocumentSource = Server.MapPath("Employees.xml");

            xml1.TransformSource = Server.MapPath("Employees.xslt");

        }

    }

}

As shown above by using DocumentSource and TransformSource properties of XML control we are applying XML & XSLT. If you run the application, it displays output as shown below.

Apply If Condition on XML using XSLT

We can apply if condition on xml data by using XSLT. As shown in the above example we can fetch specified Employees data only by placing if condition in XSLT. For example, to display only Employees data whose salary is greater than 30000, modify your Employees.xslt file as shown below.

Employees.xslt

<?xml version="1.0" encoding="utf-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">

  <xsl:template match="/">

    <table border="1px" style="border-collapse:collapse">

      <tr>

        <th>Id</th>

        <th>Name</th>

        <th>Salary</th>

        <th>Location</th>

      </tr>

      <xsl:for-each select='Employees/Employee'>

        <xsl:if test='Salary &gt; 30000'>

        <tr>

          <td>

            <xsl:value-of select='@Id'/>

          </td>

          <td>

            <xsl:value-of select='Name'/>

          </td>

          <td>

            <xsl:value-of select='Salary'/>

          </td>

          <td>

            <xsl:value-of select='Location'/>

          </td>

        </tr>

        </xsl:if>

      </xsl:for-each>

    </table>

  </xsl:template>

</xsl:stylesheet>


As shown above, we have applied the if condition to display Employees whose salary is more than 30000. The output is as below after applying the above transformation.

                                                                                                                                 CSharpXMLXSLT.zip