Render XML document (obtained through ajax call) to a new window

Question

Hi I\'m looking for a way to render an XML document, that I retrieve using ajax, to a new browser window.

I am using JQuery\'s ajax() function to post JSON data to

Answer 1

Browser renders html. IE and some others open the xml file with formatting, but that's not the default behaviour of browsers - so you should not rely on it. Better solution for me is to suggest to download file, and the user will decide whenever he wants to save the file or open it. But in case you don't want file download, than you have to generate html from your xml. That's the case when you should make some formatting, add css styles for it to be more user friendly and readable. And to achieve this, the best is to use Xsl Transformation to generate your output html from xml. That would be the most elegant way to generate html directly from xml. But in case you also don't want this, and you really dont care about user experience, you could use some text element (p, span, etc) and write xml not directly into new window, but in this element's text. That way your xml will be displayed as is

Answer 2

You have to set popup to be Content-type: text/xml and ofc start popup with <?xml version="1.0" encoding="UTF-8"?>

Answer 3

The following will work only in FireFox and Opera, but i think is worth mentioning ..

window.open('data:text/xml,' + encodeURIComponent( jqXHR.responseText ) );

should work with chrome as well but it seems to treat window.open differently than a usual URL.. if you just type the resulting url in chrome it works there as well..

---

Update This works with all browsers !

The thing is that javascript has the ability to tranform xml using xslt.
But not automatically, so we need to find the XML file for the reference to the XSLT file and load that as well. Then we can do the transformation in javascript and pass the resulting html to the new window.

Naturally IE handles thing differently than the rest.

$.get('xml-file-here.xml',
   function(xmlData){
                  var xml = xmlData;

                  //extract the stylesheet so we can load it manually
                  var stylesheet;
                   for (var i=0;i<xml.childNodes.length;i++){
                       if ( xml.childNodes[i].nodeName =='xml-stylesheet' )
                       {
                        stylesheet = xml.childNodes[i].data;
                       }
                   }
                  var items = stylesheet.split('=');
                  var xsltFile = items[items.length-1].replace(/"/g,'');

                  //fetch xslt manually
                  $.get( xsltFile, function(xsltData){
                      var xslt = xsltData;
                      var transformed;

                      if (! window['XSLTProcessor'])
                        {
                            // Trasformation for IE
                            transformed = xml.transformNode(xslt);
                        }
                        else
                        {
                            // Transformation for non-IE
                            var processor = new XSLTProcessor();
                            processor.importStylesheet(xslt);
                            var xmldom = processor.transformToDocument(xml);
                            var serializer = new XMLSerializer();
                            var transformed = serializer.serializeToString(xmldom.documentElement);
                        }

                      var newwindow = window.open();
                      newwindow.document.open();
                      newwindow.document.write(transformed);
                      newwindow.document.close();
                  });
   });

Answer 4

Write the XML into a textarea. Style the textarea using CSS.

Answer 5

You might lose a buzzword, but why dont you just open a window that points to the controller's URL?