Modifying existing .xml and .xsl to display in html forms

Question

ncis_sg1 0 Light Poster

13 Years Ago

Ok I am having trouble with this homework assignment. I need to modify the code to sort by the number of pages rather than by chapte number. I get this part but the code I need to modify will not display correctly in my internet browser. All I see is my code and never the image it is meant to display. Here is the code.

.xml code

<?xml version = "1.0"?>
<?xml-stylesheet type = "text/xsl" href = "sorting.xsl"?>

<!-- Fig. 15.20 sorting.xml -->
<!-- XML document containing book information -->
<book isbn = "999-99999-9-X">
   <title>Deitel&apos;s XML Primer</title>

   <author>
      <firstName>Jane</firstName>
      <lastName>Blue</lastName>
   </author> <chapters>
      <frontMatter>
         <preface pages = "2" />
         <contents pages = "5" />
         <illustrations pages = "4" />
      </frontMatter>

      <chapter number = "3" pages = "44">Advanced XML</chapter>
      <chapter number = "2" pages = "35">Intermediate XML</chapter>
      <appendix number = "B" pages = "26">Parsers and Tools</appendix>
      <appendix number = "A" pages = "7">Entities</appendix>
      <chapter number = "1" pages = "28">XML Fundamentals</chapter>
   </chapters>

   <media type = "CD" />
</book>

<!--

.xsl code

<?xml version = "1.0"?>

<!-- Fig. 15.21: sorting.xsl -->
<!-- Transformation of book information into HTML5 -->
<xsl:stylesheet version = "1.0"                       
   xmlns:xsl = "http://www.w3.org/1999/XSL/Transform">

   <!-- write XML declaration and DOCTYPE DTD information -->
   <xsl:output method = "html" doctype-system = "about:legacy-compat" />

   <!-- match document root -->
   <xsl:template match = "/">  
      <html>
         <xsl:apply-templates/>
      </html>
   </xsl:template>

   <!-- match book -->          
   <xsl:template match = "book">
      <head>
         <meta charset = "utf-8"/>
         <link rel = "stylesheet" type = "text/css" href = "style.css"/>
         <title>ISBN <xsl:value-of select = "@isbn"/> - 
            <xsl:value-of select = "title"/></title>    
      </head>

      <body>
         <h1><xsl:value-of select = "title"/></h1>
         <h2>by 
            <xsl:value-of select = "author/lastName"/>,     
            <xsl:value-of select = "author/firstName"/></h2>

         <table>

            <xsl:for-each select = "chapters/frontMatter/*">
               <tr>
                  <td>
                     <xsl:value-of select = "name()"/>
                  </td>

                  <td>
                     ( <xsl:value-of select = "@pages"/> pages )
                  </td>
               </tr>
            </xsl:for-each>

            <xsl:for-each select = "chapters/chapter">
               <xsl:sort select = "@number" data-type = "number" 
                    order = "ascending"/>                        
               <tr>
                  <td>
                     Chapter <xsl:value-of select = "@number"/>
                  </td>

                  <td>
                     <xsl:value-of select = "text()"/>
                     ( <xsl:value-of select = "@pages"/> pages )
                  </td>
               </tr>
            </xsl:for-each>

            <xsl:for-each select = "chapters/appendix">
               <xsl:sort select = "@number" data-type = "text" 
                  order = "ascending"/>                        
               <tr>
                  <td>
                     Appendix <xsl:value-of select = "@number"/>
                  </td>

                  <td>
                     <xsl:value-of select = "text()"/>
                     ( <xsl:value-of select = "@pages"/> pages )
                  </td>
               </tr>
            </xsl:for-each>
         </table>

         <p>Pages: 
            <xsl:variable name = "pagecount"       
               select = "sum(chapters//*/@pages)"/>
            <xsl:value-of select = "$pagecount"/></p> 
         <p>Media Type: <xsl:value-of select = "media/@type"/></p>
      </body>
   </xsl:template>
</xsl:stylesheet> <chapters>
      <frontMatter>
         <preface pages = "2" />
         <contents pages = "5" />
         <illustrations pages = "4" />
      </frontMatter>

      <chapter number = "3" pages = "44">Advanced XML</chapter>
      <chapter number = "2" pages = "35">Intermediate XML</chapter>
      <appendix number = "B" pages = "26">Parsers and Tools</appendix>
      <appendix number = "A" pages = "7">Entities</appendix>
      <chapter number = "1" pages = "28">XML Fundamentals</chapter>
   </chapters>

   <media type = "CD" />
</book>

<!--

How do I get this code to properly render the image that I need?

html-css web-design xml

2 Contributors
1 Reply
421 Views
2 Days Discussion Span
Latest Post 13 Years Ago Latest Post by Member #949455

Dani AI

Generated 9 Months Ago

Two separate issues need resolving: sorting by pages (easy) and the transform not running (why you only see raw XML). The transform failure is the root cause — if the XSLT doesn't parse or the browser can't load the stylesheet, you will see the XML source instead of rendered HTML and images.

First, quick checks that usually fix “only code shows” problems:

Open sorting.xsl by itself in an editor and make sure it contains only one top-level <xsl:stylesheet> element — remove any stray XML pasted after the closing tag. A trailing chunk of <chapters>… or a second root will cause the XSLT parser to fail.
Confirm the processing instruction in the XML exactly matches the XSL filename and path: the XML file must point to sorting.xsl and both files must be reachable.
Serve the files over HTTP (run a local server like python -m http.server) instead of double-clicking file://; browsers are less picky about loading linked resources that way and developer tools will show network/XSL errors.
Check the browser console/network tab for XSLT parse errors and for a 404 on sorting.xsl. Also remove any BOM or stray characters before the <?xml ...?> line.

Sorting and image output tips:

To sort by pages, sort on the pages attribute (use a numeric sort). If you want a single ordered list of everything, select the whole set (for example chapters/*) and sort on @pages with numeric datatype.
As suggested, the XML must contain an image URL. A simple, robust pattern is to add a small cover node in the XML and emit an <img> from XSL only if it exists. Example:

<!-- add in book.xml -->
<cover src="images/cover.jpg" alt="book cover"/>

<!-- inside your book template in sorting.xsl -->
<xsl:if test="cover/@src">
  <img src="{cover/@src}" alt="{cover/@alt}"/>
</xsl:if>

Checklist before testing: remove extra XML from sorting.xsl, ensure the PI href is correct, serve via HTTP, check console for errors, and change your sort to use pages as a numeric sort. That sequence should restore the transform and let the image display.

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Member #949455 · Answer 1 · 2013-09-07T05:21:00+00:00

Ok I am having trouble with this homework assignment. I need to modify the code to sort by the number of pages rather than by chapte number. I get this part but the code I need to modify will not display correctly in my internet browser. All I see is my code and never the image it is meant to display.

Even if this is your homework assignment how can you now understand this assignmen.t If you want xml list to display a image then you need to put the link on the xml file in

for example:

<firstName>Jane</firstName>

Let's used that as an example now I add a link:

<image:image>
 <image:loc>http://daniweb.com/image.jpg</image:loc>
</image:image>

now when you upload that xml with the path to that image that link will appear.

when you used xml files it's just data and you can used it as a sitemap.

This is my answer to your question and I am a bit curious what you did to solve your question. It would be nice if you can share how you did it.