469,906 Members | 2,237 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,906 developers. It's quick & easy.

Show image using xslt in html page

I need to show image using xslt
Below provided in my xml and xslt.
Expand|Select|Wrap|Line Numbers
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <?xml-stylesheet type="text/xsl" href="../xyz.xsl"?>
  3. <Grade class="03" subject="Science">
  4.     <media id="2809">
  5.         <topic>A Bird's Paradise</topic>
  6.         <category>Concept</category>
  7.         <type>Animation</type>
  8.         <objectives>            
  9.             <list>To build a bird shelter or bird paradise 
  10.             </list>
  11.         </objectives>
  12.         <synopsis>
  13.             <list> 
  14.             The animation introduces the child to build a secure and happy environment for birds.
  15.             </list>
  16.         </synopsis>
  17.     </media>
  18.     <media id="2863">
  19.         <topic>A Good House</topic>
  20.         <category>Concept</category>
  21.         <type>Animation</type>
  22.         <objectives>            
  23. <list>To list out the parameters of a good house</list>
  24.         </objectives>
  25.         <synopsis>
  26. <list> 
  27. The features of a good and comfortable house, whether large or small, are carefully explained with colourful illustrations to a child.</list>
  28.         </synopsis>
  29.     </media>
  30. </Grade>
========
Using the media id, i need to select the image with the same id(filename) from images folder and display it. Below is the xslt code.
==========
Expand|Select|Wrap|Line Numbers
  1. <?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE xsl:stylesheet  [
  2.     <!ENTITY nbsp   "*">
  3.     <!ENTITY copy   "">
  4.     <!ENTITY reg    "">
  5.     <!ENTITY trade  "">
  6.     <!ENTITY mdash  "">
  7.     <!ENTITY ldquo  "">
  8.     <!ENTITY rdquo  ""> 
  9.     <!ENTITY pound  "">
  10.     <!ENTITY yen    "">
  11.     <!ENTITY euro   "">
  12. ]>
  13. <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  14. <xsl:output method="html" encoding="iso-8859-1" doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
  15. <xsl:template match="/">
  16. <html xmlns="http://www.w3.org/1999/xhtml">
  17. <head>
  18. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
  19. <title>
  20.     <xsl:for-each select="Grade">
  21.         Class <xsl:value-of select="@class" />&nbsp;<xsl:value-of select="@subject" />
  22.     </xsl:for-each>
  23. </title>
  24. <style type="text/css">
  25. .hd
  26. {
  27.     display:block;
  28.     font-family:Arial, Helvetica, sans-serif;
  29.     font-size:12pt;
  30.     font-weight:bold;
  31.     text-decoration:underline;
  32.     text-align:center;
  33.     color:#ff6600;
  34. }
  35. table.grey
  36. {
  37.     border-left:#ccc 1px solid;
  38.     border-top:#ccc 1px solid;
  39. }
  40. td.grey
  41. {
  42.     border-right:#ccc 1px solid;
  43.     border-bottom:#ccc 1px solid;
  44.     font-family:Arial, Helvetica, sans-serif;
  45.     font-size:10pt;
  46.     font-weight:normal;
  47.     text-decoration:none;
  48.     padding:3px;
  49. }
  50. td p
  51. {
  52.     font-family:Arial, Helvetica, sans-serif;
  53.     font-size:10pt;
  54.     text-align:left;
  55. }
  56.  
  57. </style>
  58. </head>
  59. <body>
  60.     <xsl:for-each select="Grade">
  61.     <h4>
  62.         <span class="hd">Class <xsl:value-of select="@class" />&nbsp;<xsl:value-of select="@subject" /></span>
  63.     </h4>
  64.     </xsl:for-each>
  65.     <xsl:for-each select="Grade">
  66.         <xsl:variable name="cls" select="@class" />
  67.         <xsl:variable name="subj" select="@subject" />
  68.     <xsl:for-each select="media">
  69.     <table width="100%" border="0" cellpadding="0" cellspacing="0" id="tbl1" class="grey">
  70.         <tr>
  71.             <td width="15%" class="grey"><b>Grade</b></td>
  72.             <td width="20%" class="grey"><xsl:value-of select="$cls" /></td>
  73.             <td width="65%" rowspan="6" class="grey">
  74.                 SHOW THE IMAGE HERE
  75.             </td>
  76.         </tr>
  77.         <tr>
  78.             <td class="grey"><b>Subject</b></td>
  79.             <td class="grey"><xsl:value-of select="$subj" /></td>
  80.         </tr>
  81.         <tr>
  82.             <td class="grey"><b>Topic</b></td>
  83.             <td class="grey"><xsl:value-of select="topic" /></td>
  84.         </tr>
  85.         <tr>
  86.             <td class="grey"><b>Category</b></td>
  87.             <td class="grey"><xsl:value-of select="category" /></td>
  88.         </tr>
  89.         <tr>
  90.             <td class="grey"><b>Media Type</b></td>
  91.             <td class="grey"><xsl:value-of select="type" /></td>
  92.         </tr>
  93.         <tr>
  94.             <td class="grey"><b>Media ID</b></td>
  95.             <td class="grey"><xsl:value-of select="@id"></xsl:value-of></td>
  96.         </tr>
  97.         <tr>
  98.             <td class="grey"><b>Learning Objective</b></td>
  99.             <td colspan="2" class="grey">
  100.                 <xsl:value-of select="objectives" /> <br />
  101.             </td>
  102.         </tr>
  103.         <tr>
  104.             <td colspan="3" class="grey">
  105.                 <p><b>Synopsis</b></p>
  106.                 <p><xsl:value-of select="synopsis" /></p>
  107.             </td>
  108.         </tr>
  109.     </table>
  110.     <br />
  111.     </xsl:for-each>
  112.     </xsl:for-each>
  113. </body>
  114. </html>
  115. </xsl:template>
  116.  
  117. </xsl:stylesheet>
Thanks and Regards
Bkoti
May 24 '07 #1
1 4458
dorinbogdan
839 Expert 512MB
Hi,

Did you succeed to solve your problem?
If not, please let me know.
If yes, feel free to share it, to help other members with similar questions.

Thanks,
Dorin.
May 29 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

9 posts views Thread by Maurizio Penna | last post: by
2 posts views Thread by Larry Marburger | last post: by
10 posts views Thread by Raghavendra RAV | last post: by
2 posts views Thread by Scamjunk | last post: by
1 post views Thread by Arun dudee | last post: by
6 posts views Thread by kadykedar | last post: by
1 post views Thread by Waqarahmed | last post: by
reply views Thread by Salome Sato | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.