Using xml to display a table on a page

I am trying to display a table using xml on an html page.

Basically the:

xml will serve as the file that will store the data to be out putted on the table
the dtd file that defines the datatype of the listing
and an xsl file that would tell the browser what to display it and how to display.

This is an assignment am just trying to learn and improve on it.

During my cause of checking online I saw different tutorials but none showed the full steps of what I wanted exactly.

I would appreciate if someone could give me a step by step approach of how to go about it using the steps I mentioned and display in a table.

Solution

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

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

<xsl:template match="/">
    <html>
    <body>
    <table border="1" cellpadding="3">
        <tr>
          <td colspan="5" align="center">
            <!-- Filter for the project name and display it in a header.  -->
            <h2>
              <font face="tahoma" size="5">
                Status for: <xsl:value-of select="Project/Name" />
              </font>
            </h2>
          </td>
        </tr>
        <!-- Define headers for task information. -->
        <tr>
          <td colspan="5" align="center">
            Tasks:
          </td>
        </tr>
        <tr>
          <th>
            <font color="black">ID</font>
          </th>
          <th>
            <font color="black">Name</font>
          </th>
          <th>
            <font color="black">Priority</font>
          </th>
          <th>
            <font color="black">Start</font>
          </th>
          <th>
            <font color="black">Finish</font>
          </th>
        </tr>
        <!-- Filter for tasks -->
        <xsl:for-each select="Project/Tasks/Task">
          <!-- Exclude summary tasks -->
          <xsl:if test="Summary[.=0]">
            <xsl:choose>
              <!-- Display information for critical tasks with a colored background. -->
              <xsl:when test="Critical[.=1]">
                <tr>
                  <td>
                    <xsl:value-of select="ID"/>
                  </td>
                  <td>
                    <b>
                      <xsl:value-of select="Name"/>
                    </b>
                  </td>
                  <td>
                    <b>
                      <xsl:value-of select="Priority"/>
                    </b>
                  </td>
                  <td>
                    <b>
                      <xsl:value-of select="Start"/>
                    </b>
                  </td>
                  <td>
                    <b>
                      <xsl:value-of select="Finish"/>
                    </b>
                  </td>
                </tr>
              </xsl:when>
              <!-- Display information for noncritical tasks with a white background. -->
              <xsl:otherwise>
                <tr>
                  <td>
                    <xsl:value-of select="ID"/>
                  </td>
                  <td>
                    <xsl:value-of select="Name"/>
                  </td>
                  <td>
                    <xsl:value-of select="Priority"/>
                  </td>
                  <td>
                    <xsl:value-of select="Start"/>
                  </td>
                  <td>
                    <xsl:value-of select="Finish"/>
                  </td>
                </tr>
              </xsl:otherwise>
            </xsl:choose>
          </xsl:if>
        </xsl:for-each>
        <!-- Define headers for overallocated resource information. -->
        <tr>
          <td colspan="5" align="center">
            Overallocated Resources:
          </td>
        </tr>
        <tr>
          <th>
            <font color="black">ID</font>
          </th>
          <th colspan="2">
            <font color="black">Name</font>
          </th>
          <th colspan="2">
            <font color="black">Overtime Rate</font>
          </th>
        </tr>
        <!-- Filter for resources -->
        <xsl:for-each select="Project/Resources/Resource">
          <!-- Sort resources alphabetically by name -->
          <xsl:sort select="Name" />
          <!-- Display information for only resources that are overallocated. -->
          <xsl:if test="OverAllocated[.=1]">
            <tr>
              <td>
                <xsl:value-of select="ID"/>
              </td>
              <td  colspan="2">
                <xsl:value-of select="Name"/>
              </td>
              <td  colspan="2" align="center">
                $<xsl:value-of select="OvertimeRate"/>.00
              </td>
            </tr>
          </xsl:if>
        </xsl:for-each>
      </table>
    </body>
    </html>
</xsl:template>

</xsl:stylesheet>

Maybe you could try something like this..fill in the data fields and..dtd can be included for xml validation

here are tutorials that work:http://www.xmlmaster.org/en/article/d01/c07/ and http://www.codeproject.com/Articles/469723/Rendering-XML-Data-as-HTML-using-XSL-Transformatio