PLEASE I'M GOING CRAZY... NEARLY 4 MONTHS OF LEARNING... NOW I AM STUCK!
I have been at this a while, have purchased many books and now nearly finished with an enhancement to a project that I started for work. HOWEVER... I cannot get JavaScript/Internet Explorer to pass a variable to a XSL style sheet!
- I know that the coding works because, if I set a static value in my style sheet, the information displays in my html page without a problem... My problem is passing a parameter from my html to the <xsl:param name="site1" /> via JavaScript
- I am limited to client side code (data is stored on a SharePoint server)
- If I set xslProc.addParameter("site1", "Store0003"); in the JavaScript... it does not pass into the xsl sheet. So, I'm sure there is something not working with the xslProc.addParameter function...
HELP WILL BE GREATLY APPRECIATED!!!!
XSL style sheet
Code:
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html"/>
<xsl:param name="site1" />
<xsl:template match="/">
<html>
<body>
<h2>Store Information</h2>
<br />
<hr />
<table class="single" border="1">
<tr bgcolor="#FFFFFF">
<th>Store/Site</th>
<th>Address</th>
<th>City</th>
<th>State</th>
<th>Zip</th>
<th>Telephone Number</th>
<th>Technician Name</th>
</tr>
<xsl:for-each select="StoreList/Stores">
<xsl:if test="SiteName=$site1">
<tr>
<td><xsl:value-of select="SiteName"/></td>
<td><xsl:value-of select="Address"/></td>
<td><xsl:value-of select="City"/></td>
<td><xsl:value-of select="State"/></td>
<td><xsl:value-of select="Zip"/></td>
<td><xsl:value-of select="Phone"/></td>
<td><xsl:value-of select="PermTechname"/></td>
</tr>
</xsl:if>
</xsl:for-each>
</table>
</body>
XML data
Code:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<StoreList>
<Stores>
<SiteName>Store00003</SiteName>
<LocID>Store00003</LocID>
<LocName>Store 3</LocName>
<Address>1497 ROUTE xxx</Address>
<City>TABERNACLE</City>
<State>NJ</State>
<Zip>08088</Zip>
<Phone>1234567890</Phone>
<PermTechname>Bear, Yogi</PermTechname>
</Stores>
<Stores>
<SiteName>Store00006</SiteName>
<LocID>Store00006</LocID>
<LocName>Store 6</LocName>
<Address>BEACON STREET</Address>
<City>BROOKLINE</City>
<State>MA</State>
<Zip>02446</Zip>
<Phone>0123456789</Phone>
<PermTechname>Red, Fox</PermTechname>
</Stores>
</StoreList>
JavaScript (external file)
Code:
var store = document.getElementById("searchField")
//
// function which loads table from XSL to browser based on user selection
//
function displayResult(){
if(document.implementation && document.implementation.createDocument){
// Mozilla
var xsltProcessor = new XSLTProcessor();
// load the xsl file
var myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "sitesearch.xsl", false);
myXMLHTTPRequest.send(null);
// get the XML document
xslStylesheet = myXMLHTTPRequest.responseXML;
xsltProcessor.importStylesheet(xslStylesheet);
// load the xml file
myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "store_list_data.xml", false);
myXMLHTTPRequest.send(null);
var xmlSource = myXMLHTTPRequest.responseXML;
// set the parameters
xsltProcessor.setParameter(null, "site1", store);
//transform and display
var resultDocument = xsltProcessor.transformToFragment(xmlSource, document);
document.getElementById("results").appendChild(resultDocument);
// IE
}else if(window.ActiveXObject){
// Load XML
var xslt = new ActiveXObject("Msxml2.XSLTemplate.3.0");
var xsldoc = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0");
var xslproc;
xsldoc.async = false;
xsldoc.load("sitesearch.xsl");
xslt.stylesheet = xsldoc;
var xmldoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
xmldoc.async = false;
xmldoc.load("Store_List_data.xml");
xslproc = xslt.createProcessor();
xslproc.input = xmldoc;
xslproc.addParameter("site1", store);
xslproc.transform();
document.getElementById("results").innerHTML=xmldoc.transformNode(xsldoc);
}
}
HTML
Code:
<!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" xml:lang="en" xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882">
<head>
<title>Home | Search</title>
<script type='text/javascript' src='scripts/jquery/jQuery.js'></script>
<script type='text/javascript' src='/javascript/loadStores.js'></script>
<script type='text/javascript' src='/javascript/attachstyle_w_param.js'></script>
<link type="text/css" rel="stylesheet" href="/css/rcshome.css"/>
<!--[if gte mso 9]><xml>
<mso:CustomDocumentProperties>
<mso:Keywords msdt:dt="string"></mso:Keywords>
<mso:ContentType msdt:dt="string">Office Data Connection File</mso:ContentType>
<mso:Comments msdt:dt="string"></mso:Comments>
</mso:CustomDocumentProperties>
</xml><![endif]-->
</head>
<body>
<a href="home/default.aspx">
<img border="0px" src="images/header/cvs_caremark_minuteclinic.jpg"/>
</a>
<a href="/Manuals/AllItems.aspx" target="_blank"><em>Link to Manuals</em></a>
<hr />
<form action='javascript:void(0);' method='post'>
<h2>Please enter the store or site number below:</h2>
<input type="text" id="searchField" autocomplete="off" />
<button onclick="initAll()">Get List (auto complete box)</button>
<div id="information">*Use 5 digit format (12345)</div>
<br />
<div id="popups"></div>
<hr />
<fieldset>
<button onclick="displayResult()">Display Search Results</button>
<div id="results" />
</div>
</fieldset>
</form>
<hr />
</body>
</html>