Normally, client-side transformations are invoked with a xml-stylesheet processing instruction (PI). The problem is, how to pass parameters to the stylesheet. Here's a solution that works on IE6 (MSXML3) and on Netscape/Mozilla (Transformiix), using JavaScript to pass the parameters.
The framework consists of 3 parts:
Example:
<body onload="Initialize('X-target'); SetInput('demo.xml'); SetStylesheet('demo.xsl');">
...
<div id="X-target"><div>Loading...</div></div>
...
<a onclick="SetParam('lang','en'); Transform();">english</a>
...
</body>
The target div must have at least one child, because they will be replaced by the transformation result.
You might say: what's the point? I can do this without paramaters, maybe in JavaScript only or XSLT only. Well... in this case that's true, because the example is kept so simple. But imagine what you can do with larger (database-like) XML files, catalogs and the like. In server-side transformations, this is common practice (ASP, JSP...) but I for one don't have my own server: my website is hosted on my ISP's and I don't have access to server-side scripting in any way. Now, with JavaScript, it becomes possible. And you can try it at home: it works as well locally.
A standards compliant browser. This is tested and should work on:
(if you experience any problems please let me know)
2004-12-07 I think I solved a nasty little bug today, by adding an EventListener function on the loading of the XML file. There was already an EventListener on the XSL file. After experiencing problems with slightly larger XML input documents, I figured we would need one on the XML file too. It seems to fix the problems. Seems logical: wait for starting the transformation until the input document is fully loaded...
2004-11-20 I changed the MSXML ProgId's to use MSXML 3.0 rather than 4.0. After reading some articles on the MSDN site, I thought that would probably be the best way to support most users, because Internet Explorer 6.0 is still shipped with MSXML 3.0. Of course, if you need 4.0 or 5.0 features you are free to change the ProgId's (just change the msxmlVersion variable). I suppose there is no way to check the client's version of MSXML from within the JavaScript code - although I'd be happy to be proven wrong on that.