john6384 Posted October 28, 2007 Share Posted October 28, 2007 Hello, how would use a variable in an XSLT document that changes when a textfield is changed i.e I need an HTML field to filter the XML displayed by changing the XSLT. So far I have the XML displayed and know how to change it using XSLT. Also I have a Javascript function that detects a keypress in the HTML textfield. Problem is how do I update XSLT with javascript or is this the wrong way. The desired effect as you can guess is to have a search textfield that dynamically filters the XML. Only want CLUES for this please and im using a forum as a last resort and becasue of lack of time. Thank you Quote Link to comment Share on other sites More sharing options...
Barand Posted October 29, 2007 Share Posted October 29, 2007 One way, perhaps. Suppose xsl file is <?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="/"> <html> <body> <h2>My CD Collection</h2> <table border="1"> <tr bgcolor="#9acd32"> <th>Title</th> <th>Artist</th> </tr> <xsl:for-each select="catalog/cd"> <xsl:if test="price > ###"> //where ### is value you want to change <tr> <td><xsl:value-of select="title"/></td> <td><xsl:value-of select="artist"/></td> </tr> </xsl:if> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet> read xsl file with file_get_contents. use str_replace to replace "###" with your value re-save the xsl file Quote Link to comment Share on other sites More sharing options...
john6384 Posted October 29, 2007 Author Share Posted October 29, 2007 Thanks for the reply. I need to use xsltProcessor in order to make a variable in the XSL file that changes i.e: <?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format"> <xsl:template match="/"> <html> <head> <title></title> <script language="javascript"> <![CDATA[ var xslStylesheet; var xsltProcessor = new XSLTProcessor(); var myDOM; var xmlDoc; var ID = "1"; function descriptionSearchFunction(){ var myXMLHTTPRequest = new XMLHttpRequest(); myXMLHTTPRequest.open("GET", "BugList.xsl", false); myXMLHTTPRequest.send(null); xslStylesheet = myXMLHTTPRequest.responseXML; xsltProcessor.importStylesheet(xslStylesheet); myXMLHTTPRequest = new XMLHttpRequest(); myXMLHTTPRequest.open("GET", "buglist.xml", false); myXMLHTTPRequest.send(null); xmlDoc = myXMLHTTPRequest.responseXML; var fragment = xsltProcessor.transformToFragment(xmlDoc, document); ID = document.getElementById("descriptionInput").innerHTML; myXSLTProcessor.addParameter('ID', ID); myDOM = fragment; document.getElementById("descriptionInput").appendChild(fragment); } ]]> </script> </head> <body> <form name='descriptionSearchForm'> <input type='text' name='descriptionInput' id='descriptionInput' onkeyup='descriptionSearchFunction()'></input> </form> <table id="buglist"> <xsl:for-each select="buglist/bug"> <tr> <td><xsl:value-of select="if (ID != '') then ID > $ID else '5'"/></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet> Is the select if else statement correct? - is the syntax correct for checking if ID is nothing. Also if you spot any other reason for this not working then please say. Cheers Quote Link to comment Share on other sites More sharing options...
Barand Posted October 29, 2007 Share Posted October 29, 2007 no sign of this being a php problem, moved Quote Link to comment Share on other sites More sharing options...
john6384 Posted October 29, 2007 Author Share Posted October 29, 2007 Well im almost there when using IE but not in Firefox. I understand the code that uses an activeXObject although I do not understand how to do this for XMLHTTPRequest. Some clues please: <script language="javascript"> <![CDATA[ var XSLStylesheet; var XSLTProcessor = new XSLTProcessor(); var XMLDOM; function descriptionSearchFunction(xmlfile,xslfile){ ID = document.getElementById("descriptionInput").innerHTML; if(window.ActiveXObject){ XMLDOM = new ActiveXObject('Msxml2.FreeThreadedDOMDocument'); XMLDOM.async = false; XMLDOM.loadXML(xmlfile); XSLTDOM = new ActiveXObject('Msxml2.FreeThreadedDOMDocument'); XSLTDOM.async = false; XSLTDOM.load(xslfile); XSLStylesheet = new ActiveXObject('Msxml2.XSLTemplate'); XSLStylesheet.stylesheet = XSLTDOM; XSLTProcessor = XSLStylesheet.createProcessor(); XSLTProcessor.input = XMLDOM; XSLTProcessor.addParameter('ID', ID); XSLTProcessor.transform(); }else if(window.XMLHttpRequest){ var myXMLHTTPRequest = new XMLHttpRequest(); myXMLHTTPRequest.open("GET", xslfile, false); myXMLHTTPRequest.send(null); var xslRef = myXMLHTTPRequest.responseXML; XSLTProcessor.importStylesheet(xslRef); xmlhttp.open("GET",xmlfile,true); xmlhttp.send(null); } try{ content.innerHTML=XSLTProcessor.output; } catch(e){ document.open(); document.write(XSLTProcessor.output); document.close(); } } ]]> </script> Only clues as I do not learn when the code is written for me. Cheers Quote Link to comment Share on other sites More sharing options...
john6384 Posted October 30, 2007 Author Share Posted October 30, 2007 I made some progress in using XSL variables. This code gives an error in IE - error: object expected line 6 char 1 http://127.0.0.1/buglist.xml?descriptionInput=ateststring <?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:variable name="isPriority" select="2"></xsl:variable> <html> <head> <title></title> <script language="javascript"> <![CDATA[ var XSLStylesheet; var XSLTProcessor = new XSLTProcessor(); var xmlhttp = new XMLHttpRequest(); var XMLDOM; function descriptionSearchFunction(){ ID = document.getElementById("descriptionInput").innerHTML; alert("ID2"); if(window.ActiveXObject){ XMLDOM = new ActiveXObject('Msxml2.FreeThreadedDOMDocument'); XMLDOM.async = false; XMLDOM.loadXML("buglist.xml"); XSLTDOM = new ActiveXObject('Msxml2.FreeThreadedDOMDocument'); XSLTDOM.async = false; XSLTDOM.load("BugList.xsl"); XSLStylesheet = new ActiveXObject('Msxml2.XSLTemplate'); XSLStylesheet.stylesheet = XSLTDOM; XSLTProcessor = XSLStylesheet.createProcessor(); XSLTProcessor.input = XMLDOM; XSLTProcessor.addParameter('isPriority', ID); XSLTProcessor.transform(); } //If mozilla browser else if(window.XMLHttpRequest){ xmlhttp.onreadystatechange = state_Change xmlhttp.open("GET","buglist.xml",false) xmlhttp.send(null) } try{ content.innerHTML=XSLTProcessor.output; } catch(e){ document.open(); document.write(XSLTProcessor.output); document.close(); } } function state_Change() { // if xmlhttp shows "loaded" if (xmlhttp.readyState==4) { // if "OK" if (xmlhttp.status==200) { document.getElementById('XMLDiv').innerHTML = xmlhttp.responseText; } else { alert("Problem retrieving XML data"); } } } ]]> </script> </head> <body> <form name='descriptionSearchForm'> <input type='text' name='descriptionInput' id='descriptionInput' onsubmit='descriptionSearchFunction()'></input> </form> <div id="XMLDiv"> </div> <table id="buglist" style="border:1px solid black" height= "400" width="1000"> <tr><td>ID</td><td>Priority</td><td>Description</td></tr> <xsl:for-each select="buglist/bug"> <tr> <xsl:choose> <xsl:when test="IsPriority>=$isPriority"> <td><xsl:value-of select="ID"/></td> <td><xsl:value-of select="IsPriority"/></td> <td><xsl:value-of select="Description"/></td> </xsl:when> <xsl:otherwise> <td><xsl:value-of select="ID"/></td> <td><xsl:value-of select="IsPriority"/></td> <td bgcolor="#ff00ff"><xsl:value-of select="Description"/></td> </xsl:otherwise> </xsl:choose> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet> Cheers anyone Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.