CODEWITHSUNDEEP
htmlcssspring-mvcxslt
gifpif
gifpif

Reputation: 4917

xslt: css not wotking in html page

In spring project i am using XsltViewResolver to convert xml into html org.springframework.web.servlet.view.xslt.XsltViewResolver for

In html output code css is not working.
XML string:

<?xml version="1.0"?>
<kblc:kblcImportLc xmlns:kblc='http://www.kblc.com/schema/v1/kblc'>
    <kblc:ImportStructureLC>
        <kblc:ImportLCHeader>
            <kblc:ApplicantInfo>
                <kblc:ApplicantName>ApplicantTest</kblc:ApplicantName>
                <kblc:ApplicantAddress>Spring Villa Park</kblc:ApplicantAddress>
                <kblc:ApplicantCity>London</kblc:ApplicantCity>
                <kblc:ApplicantPostalCode>HA8 7EB</kblc:ApplicantPostalCode>
                <kblc:ApplicantCountry>UK</kblc:ApplicantCountry>
                <kblc:ApplicantRegion>consistent</kblc:ApplicantRegion>
                <kblc:ApplicantContactName>AA</kblc:ApplicantContactName>
                <kblc:ApplicantEmail>email@mail.com</kblc:ApplicantEmail>
                <kblc:ApplicantPhone>5856965456</kblc:ApplicantPhone>
                <kblc:ApplicantFax>021548795</kblc:ApplicantFax>
            </kblc:ApplicantInfo>
        </kblc:ImportLCHeader>
    </kblc:ImportStructureLC>
</kblc:kblcImportLc>

XSL file:

<?xml version="1.0"?>
<xsl:stylesheet version="2.0"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:kblc="http://www.kblc.com/schema/v1/kblc">
    <xsl:output method="html" version="4.0" encoding="UTF-8" indent="yes"/>
    <xsl:template match="/">
        <html>
            <head>
                <title>Sports Info</title>
                <style>
                    .HelpTitle {
                    font: 13px verdana, sans-serif;
                    font-weight: bold;
                    text-decoration: underline;
                    margin-left: 5px;
                    margin-right: 5px;
                    }
                    .HelpText {
                    font: 11px verdana, sans-serif;
                    margin-left: 5px;
                    margin-right: 5px;
                    }
                    .HelpHighlight {
                    background-color: #55be28 ;
                    }
                </style>
                <script language="javascript" type="text/javascript">
                    function init () {
                    var url = new URL(document.location);
                    var str2 = url.searchParams.get("tagName");

                    document.getElementById(str2).className = "HelpHighlight";
                    document.getElementById("ErrorString").value="someContent";
                    document.getElementById("ErrorString123").value=str2;
                    document.getElementById(str2).focus();
                    }
                </script>
            </head>
            <body onload="init();">
                <xsl:apply-templates/>
            </body>
        </html>
    </xsl:template>
    <xsl:template match="kblc:kblcImportLc/kblc:ImportStructureLC">
        <!-- Start ApplicantName -->
        <div id="ApplicantName">
            <br/>
            <div class="HelpTitle">ApplicantName</div>
            <br/>
            <div class="HelpText">
                <xsl:value-of select="kblc:ImportLCHeader/kblc:ApplicantInfo/kblc:ApplicantName" />
            </div>
            <div id="ErrorString123"></div>
            <br/>
        </div>
        <!-- End ApplicantName -->


        <!-- Start ApplicantAddress -->
        <div id="ApplicantAddress">
            <br/>
            <div class="HelpTitle">ApplicantAddress</div>
            <br/>
            <div class="HelpText">
                <xsl:value-of select="kblc:ImportLCHeader/kblc:ApplicantInfo/kblc:ApplicantAddress" />
            </div>
            <div id="ErrorString"></div>
            <br/>
        </div>
        <!-- End ApplicantAddress -->

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

HTML output:

<html xmlns:kblc="http://www.kblc.com/schema/v1/kblc">
  <head>
    <META http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Sports Info</title>
    <style>
                    .HelpTitle {
                    font: 13px verdana, sans-serif;
                    font-weight: bold;
                    text-decoration: underline;
                    margin-left: 5px;
                    margin-right: 5px;
                    }
                    .HelpText {
                    font: 11px verdana, sans-serif;
                    margin-left: 5px;
                    margin-right: 5px;
                    }
                    .HelpHighlight {
                    background-color: #55be28 ;
                    }
                </style>
    <script type="text/javascript" language="javascript">
                    function init () {
                    var url = new URL(document.location);
                    var str2 = url.searchParams.get("tagName");

                    document.getElementById(str2).className = "HelpHighlight";
                    document.getElementById("ErrorString").value="someContent";
                    document.getElementById("ErrorString123").value=str2;
                    document.getElementById(str2).focus();
                    }
                </script>
  </head>
  <body onload="init();">

    <div id="ApplicantName">
      <br>
      <div class="HelpTitle">ApplicantName</div>
      <br>
      <div class="HelpText">ApplicantTest</div>
      <div id="ErrorString123"></div>
      <br>
    </div>
    <div id="ApplicantAddress">
      <br>
      <div class="HelpTitle">ApplicantAddress</div>
      <br>
      <div class="HelpText">Spring Villa Park</div>
      <div id="ErrorString"></div>
      <br>
    </div>


  </body>
</html>

In this html css is not working.

Upvotes: 0

Views: 174

Answers (1)

Alejandro
Alejandro

Reputation: 1882

From comments

html tag have name space is this cause the css is not working?

That shouldn't be the case. But if you want to not output that strange namespace declaration in an HTML document, then use the exclude-result-prefixes atribute in the xsl:stylesheet element:

<xsl:stylesheet version="2.0"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:kblc="http://www.kblc.com/schema/v1/kblc"
                exclude-result-prefixes="kblc">

Upvotes: 1

Related Questions