Solved

Client-side XSL in Netscape

Posted on 2004-09-14
1
272 Views
Last Modified: 2008-02-01
I have an HTML file with an embedded XML island. It contains a reference to an external XSL stylesheet. This works well in IE, but in Netscape the XSL outputs the data elements, but not the HTML. Here is what I have so far.

<html>
<head>
<title>Example 3</title>
<script language="JavaScript">
<!--
function transformIsland(xmlIsland,xslFile) {

if (document.implementation && document.implementation.createDocument) // Netscape
{
var xsltProcessor = new XSLTProcessor();
var myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", xslFile, false);
myXMLHTTPRequest.send(null);
var xslRef = myXMLHTTPRequest.responseXML;
xsltProcessor.importStylesheet(xslRef);
var xmlRef = document.implementation.createDocument("", "", null);
var myNode = document.getElementById(xmlIsland);
var clonedNode = xmlRef.importNode(myNode,true);
xmlRef.appendChild(clonedNode);
var fragment = xsltProcessor.transformToFragment(xmlRef, document);
document.getElementById("divResults").appendChild(fragment)              

}
else if (window.ActiveXObject) // Internet Explorer
{
xslRef = new ActiveXObject("Microsoft.XMLDOM");
xslRef.load(xslFile);
var xmlRef = document.getElementById(xmlIsland);
document.write(xmlRef.transformNode(xslRef));

}
else
{
alert('Your browser can\'t handle this script'); // unsupported browser
}

}
-->
</script>
</head>
<body onLoad="transformIsland('xmlExample','Example2.xsl');">
<div id="divResults">
</div>
<xml id="xmlExample" style="visibility:hidden;">
<Article>
<Header>My Article</Header>
<Authors>
<Author>Mr. Foo</Author>
<Author>Mr. Bar</Author>
</Authors>
<Body>This is my article text.</Body>
</Article>
</xml>
</body>
</html>

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html"/>
<xsl:template match="Article">
<html>
<head>
<title>Example 2</title>
</head>
<body>
<table border="1">
<tbody>
<tr>
<th>Article</th>
<th>Authors</th>
<th>Text</th>
</tr>
</tbody>
<tr>
<td>
<xsl:value-of select="Header"/>
</td>
<td>
<xsl:for-each select="Authors/Author">
<xsl:value-of select="."/>
<br/>
</xsl:for-each>
</td>
<td>
<xsl:value-of select="Body"/>
</td>
</tr>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>


0
Comment
Question by:mariita
1 Comment
 
LVL 15

Accepted Solution

by:
dualsoul earned 500 total points
ID: 12059465
hm...i'll answer to previous questoin, concerning catalog of CDs.

1. when you get embedded xml - your first node is XML, not catalog, so you need update your XSLT or get 1 child node, see code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript">
function transformIsland(xmlIsland,xslFile) {

     if (document.implementation && document.implementation.createDocument) // Netscape
          {
          var xsltProcessor = new XSLTProcessor();
         
          // Load the xsl file using synchronous XMLHttpRequest
          var myXMLHTTPRequest = new XMLHttpRequest();
          myXMLHTTPRequest.open("GET", xslFile, false);
          myXMLHTTPRequest.send(null);
          var xslRef = myXMLHTTPRequest.responseXML;
          xsltProcessor.importStylesheet(xslRef);
         
          // create a new XML document in memory
          var xmlRef = document.implementation.createDocument("", "", null);
          var myNode = document.getElementById(xmlIsland);

          var clonedNode = xmlRef.importNode(myNode.childNodes.item(1), true);
         
          xmlRef.appendChild(clonedNode);
//          alert(xmlRef.childNodes.item(0).childNodes.item(1).nodeName);          
         
          // do the transform    
          var fragment = xsltProcessor.transformToFragment(xmlRef, document);
//          alert(fragment.childNodes.item(0).nodeName);
          var divNode=document.getElementById("divResults");
          divNode.innerHTML="";
//          divNode.innerHTML=fragment;
        divNode.appendChild(fragment);            

          }
     else if (window.ActiveXObject) // Internet Explorer
          {
          xslRef = new ActiveXObject("Microsoft.XMLDOM");
          xslRef.load(xslFile);
          var xmlRef = document.getElementById(xmlIsland);
          divResults.innerHTML = xmlRef.transformNode(xslRef);          
         
          }
     else
          {
          alert('Your browser can\'t handle this script'); // unsupported browser
          }

}
</script>    
</head>
<body>

<a href="javascript:transformIsland('XMLData','xslStyle1.xsl');">View 1</a><br>
<a href="javascript:transformIsland('XMLData','xslStyle2.xsl');">View 2</a><br>
<br><br>
<div id="divResults">
</div>

<xml id="XMLData" style="display:none;">
<catalog>
     <cd>
          <title>Empire Burlesque</title>
          <artist>Bob Dylan</artist>
          <country>USA</country>
          <company>Columbia</company>
          <price>10.90</price>
          <year>1985</year>
     </cd>
     <cd>
          <title>Hide your heart</title>
          <artist>Bonnie Tyler</artist>
          <country>UK</country>
          <company>CBS Records</company>
          <price>9.90</price>
          <year>1988</year>
     </cd>
     <cd>
          <title>Greatest Hits</title>
          <artist>Dolly Parton</artist>
          <country>USA</country>
          <company>RCA</company>
          <price>9.90</price>
          <year>1982</year>
     </cd>
</catalog>

</xml>

</body>
</html>

, ok, now we have trouble with <title> element - i think Netscape treats it like html <title> element and therefore doesn't include it in XML data island - so your stylesheet won't show it.

May be you need to read mode about XMLIslands in Netscape at the developers edge.
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

Suggested Solutions

The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
Browsing the questions asked to the Experts of this forum, you will be amazed to see how many times people are headaching about monster regular expressions (regex) to select that specific part of some HTML or XML file they want to extract. The examp…
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…
This video explains how to create simple products associated to Magento configurable product and offers fast way of their generation with Store Manager for Magento tool.

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now