Search code examples
htmlxmlxslttransformation

Simple XSLT Question: setting inner HTML node attribute values such as <div id="something">

Given the contrived XML schema, sample XML input, and sample XSLT below used to transform XML to HTML. How do I set attributes within tags? For example <div id=HouseNumber>,<input type="checkbox" id=Zipcode>, etc?

Note: The lack of quotes around HouseNumber and Zipcode are on purpose. I am trying to put the value of these attributes from the XML input into id="", for="", name="", etc.

Sample XML Schema

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

<xs:schema elementFormDefault="qualified"  xmlns:xs="http://www.w3.org/2001/XMLSchema">
    <xs:element name="Location">
        <xs:complexType>
            <xs:attribute name="State" type="xs:string" use="required" />
            <xs:attribute name="County" type="xs:string" use="required" />
            <xs:attribute name="City" type="xs:string" use="required" />
            <xs:attribute name="Zipcode" type="xs:nonNegativeInteger" use="required" />
            <xs:attribute name="HouseNumber" type="xs:nonNegativeInteger" use="required" />
        </xs:complexType>
    </xs:element>
</xs:schema>

Sample XML Input:

<Location>
    <State>California</State>
    <County>Los Angeles County</County>
    <City>Los Angeles</City>
    <Zipcode>90210</Zipcode>
    <HouseNumber>123</HouseNumber>
</Location>

Sample XSLT:

   <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="html"/>
    <xsl:template match="/">
    <xsl:for-each select="Location">
        <!--Inner HTML example, div has no id-->
        <div class="houseStyle">
            <ul>
                <li><xsl:value-of select="Location/State"/></li>
                <li><xsl:value-of select="Location/County"/></li>
                <li><xsl:value-of select="Location/City"/></li>
                <li><xsl:value-of select="Location/Zipcode"/></li>
            </ul>
        </div>
        <!--Inner HTML example again, but how do I
            set the div id to HouseNumber?-->
        <div class="houseStyle" id=HouseNumber>
            <ul>
                <li><xsl:value-of select="Location/State"/></li>
                <li><xsl:value-of select="Location/County"/></li>
                <li><xsl:value-of select="Location/City"/></li>
                <li><xsl:value-of select="Location/Zipcode"/></li>
            </ul>
        </div>
    </xsl:for-each>
</xsl:stylesheet>

Desired HTML Output, where the div tag has an id of a house number:

<div class="houseStyle" id="123">
    <ul>
        <li>California</li>
        <li>Los Angeles County</li>
        <li>Los Angeles</li>
        <li>90210</li>
    </ul>
</div>
Solution

  • It is not clear what you want here. Do you mean that you want to set your attribute to the result of some XPath expression (like Delta)? If so, this should do the trick:

    <div class="stylishClass" id="{Delta}">

    Alternatively you may use <xsl:element> and <xsl:attribute>, as other answers describe, though the typical use case for that is when element/attribute name itself has to be generated.