XML data to HTML - seems easy, but I struggle

Question

Using classic ASP and MSXML2.DOMDocument, I'm trying to convert this XML into a HTML table. Can anyone point me in the right direction? What is the logical process?

This is the XML I want to convert.

The desired output format is here - http://ashleylangford.com/tableex.gif

<?xml version="1.0"?>
<inv-balance>

<item color-code="50" description="G200 ASH.GREY S" item-number="0620404A3" price="$2.60" size-code="3" special-expiry="06/30/12" specialPrice="$1.92" style-code="G200">
  <transit-time days="0">386</transit-time>
  <transit-time days="1">6602</transit-time>
  <transit-time days="2">9090</transit-time>
  <transit-time days="3">88755</transit-time>
  <transit-time days="5">2394</transit-time>
  <transit-time days="All">107227</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY M" item-number="0620404A4" price="$2.60" size-code="4" special-expiry="06/30/12" specialPrice="$1.92" style-code="G200">
  <transit-time days="0">422</transit-time>
  <transit-time days="1">9428</transit-time>
  <transit-time days="2">12162</transit-time>
  <transit-time days="3">86798</transit-time>
  <transit-time days="5">3523</transit-time>
  <transit-time days="All">112333</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY L" item-number="0620404A5" price="$2.60" size-code="5" special-expiry="06/30/12" specialPrice="$1.92" style-code="G200">
  <transit-time days="0">548</transit-time>
  <transit-time days="1">14810</transit-time>
  <transit-time days="2">17335</transit-time>
  <transit-time days="3">84832</transit-time>
  <transit-time days="5">5611</transit-time>
  <transit-time days="All">123136</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY XL" item-number="0620404A6" price="$2.60" size-code="6" special-expiry="06/30/12" specialPrice="$1.92" style-code="G200">
  <transit-time days="0">644</transit-time>
  <transit-time days="1">15040</transit-time>
  <transit-time days="2">16954</transit-time>
  <transit-time days="3">50635</transit-time>
  <transit-time days="5">5995</transit-time>
  <transit-time days="All">89268</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY 2XL" item-number="0620404A7" price="$4.19" size-code="7" special-expiry="06/30/12" specialPrice="$3.39" style-code="G200">
  <transit-time days="0">343</transit-time>
  <transit-time days="1">5374</transit-time>
  <transit-time days="2">7016</transit-time>
  <transit-time days="3">26033</transit-time>
  <transit-time days="5">2592</transit-time>
  <transit-time days="All">41358</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY 3XL" item-number="0620404A8" price="$4.33" size-code="8" special-expiry="06/30/12" specialPrice="$3.39" style-code="G200">
  <transit-time days="0">153</transit-time>
  <transit-time days="1">1242</transit-time>
  <transit-time days="2">1896</transit-time>
  <transit-time days="3">4699</transit-time>
  <transit-time days="5">803</transit-time>
  <transit-time days="All">8793</transit-time>
  </item>

  <item color-code="50" description="G200 ASH.GREY 4XL" item-number="0620404A9" price="$4.49" size-code="9" special-expiry="06/30/12" specialPrice="$3.39" style-code="G200">
  <transit-time days="0">18</transit-time>
  <transit-time days="1">78</transit-time>
  <transit-time days="2">159</transit-time>
  <transit-time days="3">237</transit-time>
  <transit-time days="5">62</transit-time>
  <transit-time days="All">554</transit-time>
  </item>
  <item color-code="50" description="G200 ASH.GREY 5XL" item-number="0620404AA" price="$4.63" size-code="0" special-expiry="06/30/12" specialPrice="$3.39" style-code="G200">
  <transit-time days="0">16</transit-time>
  <transit-time days="1">295</transit-time>
  <transit-time days="2">215</transit-time>
  <transit-time days="3">2127</transit-time>
  <transit-time days="5">119</transit-time>
  <transit-time days="All">2772</transit-time>
  </item>

  </inv-balance>

Answer 1

Here is chunk of code that'll get you close

The ASP page you will need:

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%> 
<%Option Explicit 


Dim dom : Set dom = CreateObject("MSXML2.DOMDocument.3.0")

dom.async = false
dom.load Server.MapPath("/inventory/stockfor0620404A.xml")


Dim xslTemplate

If IsObject(Application("stocktablerendering")) Then
    Set xslTemplate = Application("stocktablerendering")
Else
    Dim xsl : Set xsl = CreateObject("MSXML2.FreeThreadedDOMDocument.3.0")

    xsl.async = false
    xsl.load Server.MapPath("/xslstylesheets/stocktablerendering.xsl")

    Set xslTemplate = CreateObject("MSXML2.XSLTemplate.3.0")
    xslTemplate.stylesheet = xsl
    Set Application("stocktablerendering") = xslTemplate
End If


Dim xslProc: Set xslProc = xslTemplate.createProcessor()
xslProc.input = dom

xslProc.transform()

Response.CharSet = "UTF-8"

Response.Write xslProc.output

%>

This code assumes your XML is in a file at "/inventory/stockfor0620404A.xml" and that the following XSL in a file at "/xslstylesheets/stocktablerendering.xsl":

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

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

  <xsl:key name="transitTimes" match="transit-time" use="@days" />

  <xsl:output method="html"  />

  <xsl:template match="/inv-balance">
    <html>
      <body>
        <table>
          <thead>
            <tr>
              <th>&#160;</th>
              <th>S</th>
              <th>M</th>
              <th>L</th>
              <th>XL</th>
              <th>2XL</th>
              <th>3XL</th>
              <th>4XL</th>
              <th>5XL</th>
            </tr>
          </thead>
          <tbody>
            <xsl:apply-templates select="item/transit-time[count(key('transitTimes', @days)[1] | .) = 1]">
              <xsl:sort select="@days" />
            </xsl:apply-templates>

          </tbody>
        </table>
      </body>
    </html>
  </xsl:template>

  <xsl:template match="transit-time">
    <xsl:variable name="days" select="@days" />
    <tr>
      <td>
        Stock available to reach you in <xsl:value-of select="@days" /> day
      </td>
      <xsl:for-each select="../../item/transit-time[@days=$days]">
        <td>
          <span>
            <xsl:value-of select="." />
          </span>
        </td>
      </xsl:for-each>
    </tr>
  </xsl:template>


</xsl:stylesheet>

There are a shed load of assumptions in this code but delivers a table of similar format to the one sited by your question from the XML in your question.