Generating an HTML table with links without using data islands

Hello!
  A number of people have asked similar questions to mine, but I find I still need help. So- here is my problem.
  I want to make an HTML table that will allow users to access a number of different related files for a number of different recordings I have.  A simplified version of my table would like like:

Filename      (WAV)     (MP3)    Text (Unicode)        Text (TIF image)       Text (JPG)   Details
Recording 1   WAV       MP3       Unicode Text           TIFF Image               JPG             Details
Recording 2   WAV       MP3       Unicode Text           TIFF Image               JPG             Details

I want each bit of text (except for the filename) to link to a file on the website, so that WAV would link (obviously) to a WAV version of the recording, and the JPG link would let users see a scanned image of accompanying text.
 
Here is the XML file that I am trying to generate this from (the first few entries, anyway):

<?xml version="1.0">
<metadata>

<item>
<filename_audio>GLSword-list.1996.01</filename_audio>
<filename_wav>GLSword-list.1996.01.wav</filename_wav>
<filename_mp3>GLSword-list.1996.01.mp3</filename_mp3>
<xml_unicode>GLSword-list.1997.01.xml</xml_unicode>
<html_unicode>GLSword-list.1997.01.htm</html_unicode>
<unicode_entries>1 - 38</unicode_entries>
<filename_image>GLSword-list.1996.01</filename_image>
<image_tif>GLSword-list.1996.01.tif</image_tif>
<image_jpg>GLSword-list.1996.01.jpg</image_jpg>
<details>GLSrecord_details.xml</details>
</item>

<item>
<filename_audio>GLSword-list.1996.02</filename_audio>
<filename_wav>GLSword-list.1996.02.wav</filename_wav>
<filename_mp3>GLSword-list.1996.02.mp3</filename_mp3>
<xml_unicode>GLSword-list.1997.01.xml</xml_unicode>
<html_unicode>GLSword-list.1997.01.htm</html_unicode>
<unicode_entries>39 - 80</unicode_entries>
<filename_image>GLSword-list.1996.02</filename_image>
<image_tif>GLSword-list.1996.02.tif</image_tif>
<image_jpg>GLSword-list.1996.02.jpg</image_jpg>
<details>GLSrecord_details.xml</details>
</item>

<item>
<filename_audio>GLSword-list.1996.03</filename_audio>
<filename_wav>GLSword-list.1996.03.wav</filename_wav>
<filename_mp3>GLSword-list.1996.03.mp3</filename_mp3>
<xml_unicode>GLSword-list.1997.01.xml</xml_unicode>
<html_unicode>GLSword-list.1997.01.htm</html_unicode>
<unicode_entries>81 - 121</unicode_entries>
<filename_image>GLSword-list.1996.03</filename_image>
<image_tif>GLSword-list.1996.03.tif</image_tif>
<image_jpg>GLSword-list.1996.03.jpg</image_jpg>
<details>GLSrecord_details.xml</details>
</item>

<item>
<filename_audio>GLSword-list.1996.04</filename_audio>
<filename_wav>GLSword-list.1996.04.wav</filename_wav>
<filename_mp3>GLSword-list.1996.04.mp3</filename_mp3>
<xml_unicode>GLSword-list.1997.01.xml</xml_unicode>
<html_unicode>GLSword-list.1997.01.htm</html_unicode>
<unicode_entries>122 - 160</unicode_entries>
<filename_image>GLSword-list.1996.04</filename_image>
<image_tif>GLSword-list.1996.04.tif</image_tif>
<image_jpg>GLSword-list.1996.04.jpg</image_jpg>
<details>GLSrecord_details.xml</details>
</item>
   
</metadata>  

So, after my table is generated, I would want the first WAV link to link to "GLSword-list.1997.01.wav" (the <filename_audio> element of the first item), the first MP3 to link to GLSword-list.1997.01.mp3, etc.

I've been able to do this with data islands, but discovered to late that browsers that aren't Windows Internet Explorer don't support data islands.

Thanks in advance for your help!
adulcimistAsked:
Who is Participating?
 
conorjConnect With a Mentor Commented:
OK, just spotted some typos in my original reply. All the href attributes should have curly-braces as follows:

<a href="{filename_wav}">

this is a shorthand way or writing

<a>
<xsl:attribute name="href"><xsl:value-of select="filename_wav" /></xsl:attribute>
...
</a>

rgds,
Conor.
0
 
conorjCommented:
Is this what you want?? Obviously, you will want to change the CSS styling to suit your needs, etc, etc

..............
<xsl:template match="/">
    <table>
        <thead>
            <tr>                                
                <th>Filename</th>
                <th>(WAV)</th>
                <th>(MP3)</th>
                <th>Text (Unicode)</th>
                <th>Text (TIF image)</th>
                <th>Text (JPG)</th>
                <th>Details</th>
            </tr>
        </thead>
        <tbody>
            <xsl:apply-templates select="metadata/item" />
        </tbody>
    </table>
</xsl:template>

<xsl:template match="item">
    <tr>
        <td><xsl:value-of select="filename_audio" /></td>
        <td><a href="filename_wav"><xsl:value-of select="filename_wav" /></a></td>
        <td><a href="filename_mp3"><xsl:value-of select="filename_mp3" /></a></td>
        <td><a href="html_unicode"><xsl:value-of select="html_unicode" /></a></td>
        <td><a href="image_tif"><xsl:value-of select="image_tif" /></a></td>
        <td><a href="image_jpg"><xsl:value-of select="image_jpg" /></a></td>
        <td><a href="details"><xsl:value-of select="details" /></a></td>
    </tr>
</xsl:template>
..................

rgds,
Conor.
0
 
adulcimistAuthor Commented:
Hmm...I'm afraid I'm still having trouble, but it's probably the way I'm linking your stylesheet to my document.
 Using what you typed, I made an external XSL file metadata.xsl:

<?xml version="1.0"?>

<stylesheet xmlns:xsl="http://wwww.w3.org/1999/Transform">
<xsl:template match="/">
    <table>
        <thead>
            <tr>                                
                <th>Filename</th>
                <th>(WAV)</th>
                <th>(MP3)</th>
                <th>Text (Unicode)</th>
                <th>Text (TIF image)</th>
                <th>Text (JPG)</th>
                <th>Details</th>
            </tr>
        </thead>
        <tbody>
            <xsl:apply-templates select="metadata/item" />
        </tbody>
    </table>
</xsl:template>

<xsl:template match="item">
    <tr>
        <td><xsl:value-of select="filename_audio" /></td>
        <td><a href="filename_wav"><xsl:value-of select="filename_wav"

/></a></td>
        <td><a href="filename_mp3"><xsl:value-of select="filename_mp3"

/></a></td>
        <td><a href="html_unicode"><xsl:value-of select="html_unicode"

/></a></td>
        <td><a href="image_tif"><xsl:value-of select="image_tif" /></

a></td>
        <td><a href="image_jpg"><xsl:value-of select="image_jpg" /></

a></td>
        <td><a href="details"><xsl:value-of select="details" /></a></

td>
    </tr>
</xsl:template>
</stylesheet>

And then I liked this file to my XML document by entering the line:

<?xml-stylesheet type="text/xsl" href="metadata.xsl"?>

With these changes, when I open my XML document, Internet Explorer displays only the table headers, while Netscape 7.0 and Firefox both give me:

Error loading stylesheet: Parsing an XSLT stylesheet failed.

Clearly I'm doing something wrong...
0
What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

 
adulcimistAuthor Commented:
Addendum: After posting that, I realized that when I pasted your code into notepad, some of the lines got broken up.  That's not the problem.  I've fixed that, and still no luck.
0
 
adulcimistAuthor Commented:
Ok- so I've gotten the stylesheet to interact properly with my xml, but when the list generates, the links don't work quite right.  right now, using

td><a href="filename_wav"><xsl:value-of select="filename_wav" /></a></td>,

the link is literally to "filename_wav" and not to the value of <filename_wav> in my XML file, which is what I need.
  Did the links reference the value properly on your computer?
0
 
adulcimistAuthor Commented:
Beautiful!  That's exactly what I want- the curly braces were definitely the missing bit of information that I needed.  Thanks so much!
            Patrick
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.