Transform XML to HTML using XSLT and XSD validation




  • We come across many scenarios where we have nodes created in xml format and we want to generate HTML from it and render on page.
  • We can use XSLT transform which reads the xml nodes and returns the output in HTML format.
  • We can get the transformation result as HTML, XML or Text depending on our needs.
  • In this article we are validating our XML as per XSD first and depending on the validation result we are transforming the XML. 
  • The returned HTML is then rendered on the page. We are going to render XML data with table. 

We have created a simple XML, XSD and XSLT file as following.

XML : 
<?xml version="1.0" encoding="utf-8" ?>
<Employees>
  <Employee>
    <Name>Thierry Herny</Name>
    <Address>Red Bulls</Address>
    <Designation>Striker</Designation>
  </Employee>
  <Employee>
    <Name>Cesc Fabregas</Name>
    <Address>FB Barcelona</Address>
    <Designation>MidField</Designation>
  </Employee>
</Employees>

The above is our simple XML file. We have a Employees parent node which can have multiple Employee nodes.

XSD :

<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" attributeFormDefault="unqualified" elementFormDefault="qualified">
  <xs:element name="Employees">
    <xs:complexType>
      <xs:sequence>
        <xs:element name="Employee" minOccurs="1" maxOccurs="unbounded">
          <xs:complexType>
            <xs:sequence>
              <xs:element name="Name" type="xs:string" />
              <xs:element name="Address" type="xs:string" />
              <xs:element name="Designation" type="xs:string" minOccurs="1"/>
            </xs:sequence>
          </xs:complexType>
        </xs:element>
      </xs:sequence>
    </xs:complexType>
  </xs:element>
</xs:schema>

The XSD validates the xml for structure and mandatory nodes.

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:output method="html" indent="yes"/>

    <xsl:template match="/ | node()">
      <table>
        <tr>
          <th>Name</th>
          <th>Address</th>
          <th>Designation</th>
        </tr>
        <xsl:for-each select="Employees/Employee">
          <tr>
            <td>
              <xsl:value-of select="Name"/>
            </td>
            <td>
              <xsl:value-of select="Address"/>
            </td>
            <td>
              <xsl:value-of select="Designation"/>
            </td>
          </tr>
        </xsl:for-each>
      </table>
    </xsl:template>
</xsl:stylesheet>

In the above XSLT file we have defined the table structure. The XSLT reads the XML nodes and incorporates the read values into the table and returns the HTML. We have set the output method to HTML so that the XSLT transformation returns the HTML output.

Action :

public ActionResult Index()
        {
            string xmlPath = Server.MapPath("~/Content/transform/ToBeTransformed.xml");
            string xsltPath = Server.MapPath("~/Content/transform/TransformingXSLT.xslt");
            string xsdPath = Server.MapPath("~/Content/transform/ToBeTransformed.xsd");

            if (Validate(xsdPath, xmlPath))
            {

                XslCompiledTransform transform = new XslCompiledTransform();
                transform.Load(xsltPath);

                XmlReaderSettings settings = new XmlReaderSettings();
                settings.DtdProcessing = DtdProcessing.Parse;

                StringWriter writer = null;

                using (XmlReader reader = XmlReader.Create(xmlPath, settings))
                {
                    writer = new StringWriter();
                    transform.Transform(reader, null, writer);
                }

                string html = writer.ToString();
                ViewBag.TableHTML = html;
            }

            return View();
        }

       public bool Validate(string xsdPath,string xmlPath)
        {
            try
            {
                XmlReaderSettings settings = new XmlReaderSettings();
                settings.ValidationType = ValidationType.Schema;
                settings.Schemas.Add(null, XmlReader.Create(xsdPath));

                XmlReader xmlReader = XmlReader.Create(xmlPath, settings);
                XmlDocument xmlDoc = new XmlDocument();
                xmlDoc.Load(xmlReader);
                return true;

            }
            catch (Exception e)
            {
                return false;
            }
        }

In the code, we are reading the files from their respective paths. We are validating the XML file using XSD. If the XSD validation passes then the transformation is performed and table is rendered on the page.

View :

@{
    ViewBag.Title = "Home Page";
}

<h2>@ViewBag.Message</h2>
<p>
    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>.
</p>
@if (ViewBag.TableHTML != null)
{
    <div>
    @Html.Raw(ViewBag.TableHTML)
    </div>
}
else
{
    <div>There is some XSD Validation error. Please correct your xml.
    </div>
}

In the view we are rendering the table markup in string format using Raw HTML helper. On XSD validation failure we are showing the message written else section.

SnapShots :





On XSD Validation Failure :



1 comments:

  1. Below blog also explains the transformation step by step.

    http://gunaatita.com/Blog/Converting-XML-To-HTML-using-XSLT-in-MVC/1048

    ReplyDelete