Parsing xml - xslt in javascript with Firefox

I am trying to transform an XML document using an XSLT document in Firefox:
       
        var objDOMParser = new DOMParser();
        var xml = objDOMParser.parseFromString(XMLValue, "text/xml");
        xml.async = false;
       
        alert('xml doc:' + xml.xml); //shows: undefined
       
        xsl = document.implementation.createDocument("","",null);    
        //xsl.load(XSLRef);
        try
        {
            xsl.load('XSLT/Vacaturebank.xslt');
        }
        catch(e)
        {
            alert(e.message);
        }
       
        alert('xsl doc:' + xsl.xml); //shows: undefined

        var oProcessor = new XSLTProcessor()
        oProcessor.importStylesheet(xsl);

        var oResultDom = oProcessor.transformToDocument(xml);
        alert(oResultDom.xml); //shows: undefined


All the results as stated in the above code give me: undefined. What's wrong? Is in oResultDom.xml the .xml an invalid property? Or am I missing something else?
LVL 4
frolloAsked:
Who is Participating?
 
R7AFConnect With a Mentor Commented:
Try to use Sarissa to do the transform. You can download this free library.
http://dev.abiss.gr/sarissa/

You can use the following code, works in Firefox and IE.
It's sometimes better to use .xsl as extension instead of .xslt.

#################### sarissa.html ####################

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
      <head>
            <title>Sarissa Transformation</title>
      
            <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
            <script type="text/javascript" src="../../js/sarissa/sarissa.js"></script>
            <script type="text/javascript" src="../../js/sarissa/sarissa_ieemu_xpath.js"></script>
            <script type="text/javascript" language="JavaScript">
                  <!--
                  var oXmlDoc;
                  var oXslDoc;
                  
                  // create the xml document object
                  oXmlDoc= Sarissa.getDomDocument();
                  oXmlDoc.async = false;
                  oXmlDoc.load("xml.xml");
                  
                  // create an object from the xsl
                  oXslDoc= Sarissa.getDomDocument();
                  oXslDoc.async = false;
                  oXslDoc.load("Vacaturebank.xsl");
                  
                  function show()
                  {
                        var xsltProc  = new XSLTProcessor();
                        xsltProc.importStylesheet(oXslDoc);
                        var res= xsltProc.transformToDocument(oXmlDoc);
                        document.getElementById("transform").innerHTML = new XMLSerializer().serializeToString(res);
                  }  
                  //-->
            </script>
      </head>

      <body onload="show();">
            <div id="transform"></div>
      </body>
      
</html>
0
 
Geert BormansConnect With a Mentor Information ArchitectCommented:
I do agree with R7AF that Sarrissa is a very good library for cross browser XSLT...
but sometimes people just want to make it work in Firefox...

the .xsl versus .xslt extensions have nothing to do with the loading through javascript functions,
so you can safely ignore that comment here

I see some possible issues with your code

let us start with the loading of the XSLT
Firefox users typically use an asynchrone funtion onLoad, like this

      xsl = document.implementation.createDocument("","",null);    
        try
        {
            xsl.onload = doTransform();
            xsl.load('XSLT/Vacaturebank.xslt');
        }

I tend to not follow that style.
but if you don't you need to set the load to synchronous, or you will wait for ever
      xsl = document.implementation.createDocument("","",null);    
        try
        {
            xsl.async = false;
            xsl.load('XSLT/Vacaturebank.xslt');
        }
you do that for the XML, but not for the XSLT

Then, .xml as a DOM method is an extension for MS ActiveX DOM objects and as far as I know not supported in Firefox
but you could check for the number of elements of a specific name to test for correct loading of the XML
alert("nodes found: " + xmlDoc.getElementsByTagName('designer').length);

cheers

Geert
0
 
frolloAuthor Commented:
Thanks, I'm not at home at the moment, will try it as soon as I'm home, sarissa didn't work, gave me an "undefined" result, just like my code did.
0
Cloud Class® Course: Python 3 Fundamentals

This course will teach participants about installing and configuring Python, syntax, importing, statements, types, strings, booleans, files, lists, tuples, comprehensions, functions, and classes.

 
R7AFCommented:
Maybe you could post your XSLT and a good test-sample of your XML here. Then we can test of that's the problem.
0
 
frolloAuthor Commented:
Almost there, Everything works except.... Displaying the result file.

Like:
alert(oResultDom.xml);  

Above statement works in IE, not in Firefox the ".xml" part is not a valid method in Firefox just like Gertone said.

Any suggestions?
0
 
Geert BormansInformation ArchitectCommented:
Do you need to show the xml in the alert popup?
If so, I am not sure how to do that, but I believe you need to walk the tree and explicitely add start and end tags with the data
A good hint can be found in the main sarissa.js
0
 
frolloAuthor Commented:
Final sollution:

        var objDOMParser = new DOMParser();
        var xml = objDOMParser.parseFromString(XMLValue, "text/xml");
        xml.async = false;
       
        xsl = document.implementation.createDocument("","",null);    
        try
        {
            xsl.async=false;
            xsl.load('XSLT/Vacaturebank.xslt');
        }
        catch(e)
        {
            alert(e.message);
        }
       

        var oProcessor = new XSLTProcessor()
        oProcessor.importStylesheet(xsl);

        var oResultDom = oProcessor.transformToDocument(xml);
        var serializer = new XMLSerializer();
        return serializer.serializeToString(oResultDom);

Thanks guys
0
 
Geert BormansInformation ArchitectCommented:
welcome
0
 
mrbaseball2usaCommented:
Apparently quite late to the party, but spent 3 hrs Googling this fix before I found this post, so I wanted to add a little relevancy again.

Thanks for the help / advice guys! Works perfectly now.
0
 
frolloAuthor Commented:
Indeed quite late, but it still shows up in my mail :) Glad I / we could be of help. I know it was a brainbreaker for me back then. Hope other people also post their final sollution to their problems posted. It helps the people that google, but also the people reacting to understand the question asked.
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.