asked on

Cross browser XSL Javascript solution?

Greetings,

How can I get the equivelant code to work in non-Microsoft browsers (Mozilla, Opera, etc...)?
<html>
<body>

<script type="text/javascript">
// Load XML
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("myfile.xml")

// Load XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("myfile.xsl")

// Transform
document.write(xml.transformNode(xsl))

</script>
</body>
</html>

Thanks!

ASKER CERTIFIED SOLUTION

dualsoul

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

SOLUTION

pmsyyz

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

SOLUTION

rdcpro

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

JoGor

ASKER

I tried using the code you guys suggested but now it doesn't work at all. Do I need a different XSL for different browsers? How can I accomidate all browsers with one HTML page, one XSL, and one XML?

SOLUTION

sybe

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

rdcpro

That's right. I assumed, perhaps incorrectly, that the OP was doing a scripted version because he wanted the results of the transformation to be inserted in an existing HTML page.

As far as the XSLT goes, you need to make sure you don't use something in the XSLT that is vendor-specific. For example, if you want to use the node-set() extension function, you need the correct namespace depending on the XSLT processor. There are several ways of doing this within an XSLT. My earlier comments about the XSLT were aimed at the differences between MSXML 2.0 (which came out *before* the XSLT spec reached Recommendation status) and MSXML 3.0, which supports the standard XSLT recommendation. IMHO, it's better to abandon IE 5/5.5 with the standard MSXML 2.0 implementation, as only a small fraction of those browers don't have MSXML 3.0. You can use the approach in the link I posted to auto-upgrade those few browsers.

>> "I tried using the code you guys suggested but now it doesn't work at all."

It would help to see the complete code, as used, if we're to debug this.

Regards,
Mike Sharp

JoGor

ASKER

ok here's my code.... Let me know what you think.

XML File

<?xml version="1.0" encoding="ISO-8859-1" ?>
<?xml-stylesheet type="text/xsl" href="gallery1.xsl"?>
<dan_gallery>
<picture>
<name>Figure In Motion</name>
<price>$199.95</price>
<simage>images/01_figure_in_motion_small.jpg</simage>
<limage>images/01_figure_in_motion.jpg</limage>
</picture>
<picture>
<name>Landscape</name>
<price>$199.95</price>
<simage>images/02_landscape_small.jpg</simage>
<limage>images/02_landscape.jpg</limage>
</picture>
</dan_gallery>

XSLFile

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">

<xsl:for-each select="dan_gallery/picture">

<p><xsl:value-of select="name" /></p>
<p><xsl:value-of select="price" /></p>

</xsl:for-each>

</xsl:template></xsl:stylesheet>

HTML File

<html>
<body>

<script type="text/javascript">
// Load XML
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("gallery.xml")

// Load XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("gallery.xsl")

// Transform
document.write(xml.transformNode(xsl))

</script>
</body>
</html>

rdcpro

That's correct...it won't work. Microsoft.XMLDOM is only supported on IE 5/5.5, and if you have MSXML 3 sp1 or later (which is installed by default in replace mode). And Microsoft.XMLDOM does not support the XSLT namespace http://www.w3.org/1999/XSL/Transform

This is not the cross-browser solution that was suggested. To get it working in IE6 (or IE5/5.5 w/MSXML 3.0), try this:

<html>
<body>

<script type="text/javascript">
// Load XML
var xml = new ActiveXObject("Msxml2.DomDocument")
xml.async = false
xml.load("gallery.xml")

// Load XSL
var xsl = new ActiveXObject("Msxml2.DomDocument")
xsl.async = false
xsl.load("gallery.xsl")

// Transform
document.write(xml.transformNode(xsl))

</script>
</body>
</html>

To add support for IE5/5.5 *WITHOUT MSXML 3* you'll need a new XSL stylesheet using the old WD-xsl namespace

*OR*

you'll need to provide an upgrade mechanism:
http://rdcpro.com/zones/xml/faqroot/msxmlredist/

// For IE based browsers:
var xml
var xsl
var xslUrl

if (window.ActiveXObject) {
try
{
// Uses MSXML 3, if present
xml = new ActiveXObject("Msxml2.DomDocument");
xsl = new ActiveXObject("Msxml2.DomDocument");
xslUrl = "gallery.xsl"
}
catch (e)
{
// Uses MSXML 2. MSXML 3 in replace mode (sp1 or later) will support either.
xml = new ActiveXObject("Microsoft.XMLDOM");

// You would need to decide whether you wanted to support the non-standard XMLDOM XSL syntax.
// You may elect to tell the user they must upgrade to IE6, or direct them to MS to install MSXML 3, or
// You can automatically install MSXML 3 in IE 5/5.5 using an object tag:
// http://rdcpro.com/zones/xml/faqroot/msxmlredist/
// You can do this in a pop-up if the try fails.
// If you decide to support the old non-standard XSLT,
// don't forget to point to your alternate XSLT! The APIs are different.
xsl = new ActiveXObject("Microsoft.XMLDOM")
xslUrl = "galleryLegacy.xsl"

}

// Load XML
xml.async = false
xml.load("gallery.xml")

// Load XSL
xsl.async = false
xsl.load(xslUrl)

// Transform
document.write(xml.transformNode(xsl))

}

To add cross browser support, check out the link dualsoul provided, as well as the code sample that pmsyyz provided.

Regards,
Mike Sharp