Subject: [xsl] Using Javascript to pass parameters to embedded XSL stylesheet From: Maria Amuchastegui <mamuchastegui@xxxxxxxxxxx> Date: Wed, 30 Mar 2005 13:10:07 -0500 |
I have a single XHTML file with an embedded XML data island as well as an embedded XSL stylesheet. I am using Javascript to pass sort parameters to the stylesheet. The sort is working in Netscape -- which is quite amazing -- but in IE I get a "page cannot be displayed" error message. I am not sure if this is because the page is refreshing or because the sort parameter is not getting picked up from the innerHTML property. I have tried inserting "return false();" at various points in the script, but it did not work. Here is the XHTML (it has to have an .xhtml extension): <html xmlns="http://www.w3.org/1999/xhtml <http://www.w3.org/1999/xhtml> " xml:lang="en"> <head> <script language="JavaScript"> //<![CDATA[ var arrSort = new Array(); arrSort["id"] = "ascending"; arrSort["date"] = "ascending"; arrSort["location"] = "ascending"; arrSort["number"] = "ascending"; arrSort["charges"] = "ascending"; arrSort["savings"] = "ascending"; arrSort["amount"] = "ascending"; function sortXML(theLink) { var column = "location"; var order = "descending"; if(theLink) { column = theLink.innerHTML.toLowerCase(); // fix this line if (arrSort[column] == 'ascending') { order = 'descending'; } else { order = 'ascending'; } arrSort[column] = order; } if (document.implementation && document.implementation.createDocument) // Netscape { var xslDoc; var xsltProcessor = new XSLTProcessor(); var myDOM; var xmlDoc; var xslDoc = document.implementation.createDocument("", "", null); var myXSLNode = document.getElementById("myXSLStylesheet"); var clonedXSLNode = xslDoc.importNode(myXSLNode.childNodes.item(1), true); xslDoc.appendChild(clonedXSLNode); xsltProcessor.importStylesheet(xslDoc); var xmlDoc = document.implementation.createDocument("", "", null); var myNode = document.getElementById("myXMLData"); var clonedNode = xmlDoc.importNode(myNode.childNodes.item(1), true); xmlDoc.appendChild(clonedNode); xsltProcessor.setParameter(null, "sortKey", column); xsltProcessor.setParameter(null, "sortOrder", order); var fragment = xsltProcessor.transformToFragment(xmlDoc,document); var containerElement = document.getElementById("ChargeableMessages"); while (containerElement.hasChildNodes()) { containerElement.removeChild(containerElement.lastChild); } myDOM = fragment; document.getElementById("ChargeableMessages").appendChild(fragment); } else if (window.ActiveXObject) // Internet Explorer { var xslDoc=new ActiveXObject("MSXML2.FreeThreadedDOMDocument"); var rsltDoc=new ActiveXObject("MSXML2.FreeThreadedDOMDocument"); var xslTemplate=new ActiveXObject("MSXML2.XSLTemplate"); xslDoc.load(myXSLStylesheet.XMLDocument); xslTemplate.stylesheet=xslDoc; var xslProc=xslTemplate.createProcessor(); xslProc.input=myXMLData.XMLDocument; xslProc.addParameter("sortKey", column); xslProc.addParameter("sortOrder", order); xslProc.transform(); ChargeableMessages.innerHTML = xslProc.output; return false; } else { alert('Your browser does not support client-side XSL transformations.'); // unsupported browser } } //]]></script> </head> <body onload="sortXML();"> <div id="ChargeableMessages" /> <xml id="myXMLData" style="display:none;"> <myXMLData xmlns=""> <BTN number="635 5669"> <Section number="430c" type="Detail" subHead1="Advantage Per Call" subHead2=""> <ServiceHeader group="Canada"> <message> <id>1-06</id> <date>2005-05-06</date> <location>Collingwood ON</location> <number>705 445 1030</number> <duration>1.4</duration> <charges>5.01</charges> <savings /> <amount /> </message> <message> <id>1-07</id> <date>2005-04-12</date> <location>Erin ON</location> <number>519 833 2380</number> <duration>1.1</duration> <charges>0.78</charges> <savings /> <amount /> </message> <message> <id>1-08</id> <date>2005-04-09</date> <location>Barrie ON</location> <number>705 726 4242</number> <duration>.5</duration> <charges>0.47</charges> <savings /> <amount /> </message> <message> <id>1-09</id> <date>2005-05-09</date> <location>Longueuil QC</location> <number>450 463 7180</number> <duration>1.6</duration> <charges>0.69</charges> <savings /> <amount /> </message> </ServiceHeader> <ServiceHeader group="United States"> <message> <id>1-10</id> <date>2005-05-10</date> <location>Folsom CA</location> <number>916 355 7200</number> <duration>2.4</duration> <charges>2.54</charges> <savings /> <amount /> </message> <message> <id>1-11</id> <date>2005-04-04</date> <location>Burlington MA</location> <number>781 270 1695</number> <duration>6</duration> <charges>10.35</charges> <savings /> <amount /> </message> </ServiceHeader> </Section> <Section number="450c" type="Summary" subHead1="" subHead2=""> </Section> </BTN> </myXMLData> </xml> <xml id="myXSLStylesheet" style="display:none;"> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform <http://www.w3.org/1999/XSL/Transform> " version="1.0"> <xsl:output method="html" /> <xsl:param name="sortKey" /> <xsl:param name="sortOrder" /> <xsl:template match="/"> <xsl:apply-templates select="myXMLData" /> </xsl:template> <xsl:template match="myXMLData"> <xsl:apply-templates select="//BTN" /> </xsl:template> <xsl:template match="//BTN"> <b><xsl:value-of select="@number" /></b> <xsl:for-each select="Section[@type='Detail']"> <table border="1"> <th colspan="6" align="left"> <xsl:value-of select="@subHead1" /> - click on any column to sort </th> <tr> <th> <a href="#" onclick="return sortXML(this);">ID</a> </th> <th> <a href="#" onclick="return sortXML(this);">Date</a> </th> <th> <a href="#" onclick="return sortXML(this);">Location</a> </th> <th> <a href="#" onclick="return sortXML(this);">Number</a> </th> <th> <a href="#" onclick="return sortXML(this);">Duration</a> </th> <th> <a href="#" onclick="return sortXML(this);">Charges</a> </th> </tr> <xsl:apply-templates select="ServiceHeader" /> </table> <br /> </xsl:for-each> </xsl:template> <xsl:template match="ServiceHeader"> <xsl:if test="@group != '' "> <tr> <td colspan="6"> <xsl:value-of select="@group" /> </td> </tr> </xsl:if> <xsl:choose> <xsl:when test="($sortKey = 'duration') or ($sortKey = 'charges')"> <xsl:apply-templates select="message"> <xsl:sort select="*[name() = $sortKey]" order="{$sortOrder}" data-type="number" /> </xsl:apply-templates> </xsl:when> <xsl:otherwise> <xsl:apply-templates select="message"> <xsl:sort select="*[name() = $sortKey]" order="{$sortOrder}" data-type="text" /> </xsl:apply-templates> </xsl:otherwise> </xsl:choose> </xsl:template> <xsl:template match="message"> <tr> <td> <xsl:value-of select="id" /> </td> <td> <xsl:value-of select="date" /> </td> <td> <xsl:value-of select="location" /> </td> <td> <xsl:value-of select="number" /> </td> <td> <xsl:value-of select="duration" /> </td> <td> <xsl:value-of select="charges" /> </td> </tr> </xsl:template> </xsl:stylesheet> </xml> </body> </html>
Current Thread |
---|
|
<- Previous | Index | Next -> |
---|---|---|
Re: [xsl] sort order elements, David Carlisle | Thread | Re: [xsl] Using Javascript to pass , Joe Fawcett |
Re: [xsl] Tricky inclusion match, Wendell Piez | Date | [xsl] node positioning problem, Spencer Tickner |
Month |