How do I pass parameters into xsl dynamically

Gooday,
I have an xml file that I am trying to modify using xsl but would like to have a menu where the user can click through the different options and modify the xsl to show the relevant data depending on the menu button that was clicked.

Let me know if you would like to see the xml code.

I have created part of an xsl file if you would like to have a look at that too. In essence at the moment I have created a variable that determines the continent to display. Then created n onclick js function that reloads the xml and xsl files and attempts to pass a new parameter back through but this is not working.
This is very important and I need a lot of help in getting this working
d1114170Asked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
Geert BormansConnect With a Mentor Information ArchitectCommented:
Ah, I see,
you have
    <xsl:variable name="continentID">A</xsl:variable>
that will not work, only xsl:param will receive values from outside the scope

try this instead
   <xsl:param name="continentID">A</xsl:param>
0
 
Geert BormansInformation ArchitectCommented:
How do you perform the javascript

- is this ASP, using the msxml activeX component
- is this in the browser, IE only, using the same component
- is this in a browser, using a library to make the scripts browser independent, such as Sarissa (highly recommended by the way)

In any cas you need to make the parameter that you want to get a value in teh XSLT global
the <xsl:param name="whatevername"/> should be a direct child of the xsl:stylesheet element

you need to create some sort of template processor in the JavaScript for running the XSLT
and then you likely need to use "addParameter" one way or another

If you show me how you do the XSLT transform, I can give you teh exact javascript code you need
0
 
d1114170Author Commented:
Hi,

here is my javascript at the moment. its embedded within the xsl.
function loadXMLDoc(xmlName){
              var xmlDoc;
              // code for IE
              if (window.ActiveXObject)
              {
                xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
              }
              // code for Mozilla, Firefox, Opera, etc.
              else if (document.implementation
              && document.implementation.createDocument)
              {
                xmlDoc=document.implementation.createDocument("","",null);
               }
              else
              {
                alert('Your browser cannot handle this script');
              }
                xmlDoc.async=false;
                xmlDoc.load(xmlName);
                return(xmlDoc);
                }

                function displayResult(CID)
                {
                var contentDiv = document.getElementById("xslReload")
                contentDiv.innerHTML = "";
                xml=loadXMLDoc("xmloffer.xml");
                xsl=loadXMLDoc("tester.xsl");
                // code for IE
                if (window.ActiveXObject)
                  {
                    ex=xml.transformNode(xsl);
                    document.getElementById("xslReload").innerHTML=ex;
                    //div to be populated
                  }
                  // code for Mozilla, Firefox, Opera, etc.
                  else if (document.implementation
                  && document.implementation.createDocument)
                  {
                    xsltProcessor=new XSLTProcessor();
                    xsltProcessor.importStylesheet(xsl);
                    xsltProcessor.setParameter('', "continentID", CID);
                    //pass new parameter through to xsl to determine output
                    resultDocument = xsltProcessor.transformToFragment(xml,document);
                    contentDiv.appendChild(resultDocument);
                  }
                 
                }
contentDiv is the place where I want the xsl results to be loaded into.

I cant use any serverside scripting so needs to all be within the xsl using javascript please.
If you would like to see the xml please let me know.

many thanks
0
Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
d1114170Author Commented:
anybody?
0
 
Geert BormansInformation ArchitectCommented:
Well, it is a Sunday and mothersday, so I have not been working this afternoon... some patience please

There are many things not OK in your example,
I am improving the code now,
more news in half an hour or so.
Please delete your recent duplicate question, since it is EEs policy to not allow duplicate questions
0
 
Geert BormansInformation ArchitectCommented:
The code for IE and FF is not equivalent.
Which browser you want this to work for?
If the answer is both, I highly recommend that you use Sarissa library.

Please start by downloading Sarissa from sourceforge
0
 
d1114170Author Commented:
Hi, sorry about that. I just wasnt sure if it was working ok.
I will delete my second post now. thanks.

yeah I need it to work in both browsers.
ok, i will look into downloading sarissa now.

look forward to seeing your code.

many thanks
0
 
Geert BormansInformation ArchitectCommented:
Here is a full working html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
	  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<script type="text/javascript" src="script/sarissa.js"></script>
		<script type="text/javascript" src="script/sarissa_ieemu_xpath.js"></script>
		<script type="text/javascript" language="JavaScript">
		  <!--
		  // create the xml document object
		  var oXML = Sarissa.getDomDocument();
		  oXML.async = false;
		  oXML.load("xmloffer.xml");
		  //alert(new XMLSerializer().serializeToString(oXML));
		  
		  // create an object from the xsl
		  var oXSL = Sarissa.getDomDocument();
		  oXSL.async = false; 
		  oXSL.load("tester.xsl");
		  //alert(new XMLSerializer().serializeToString(oXSL));
		  
		  function displayResult(CID)
		    {
		      var xsltProc  = new XSLTProcessor();
		      xsltProc.importStylesheet(oXSL);
		      xsltProcessor.setParameter('', "continentID", CID);
		      var transformResult = xsltProc.transformToDocument(oXML);
		      // alert(new XMLSerializer().serializeToString(transformResult));
		      document.getElementById("xslReload").innerHTML = new XMLSerializer().serializeToString(transformResult);
		    }
	
		  // -->
	    </script>
	</head>
	<body onload="showDetail('0');">
		  <div id="xslReload"></div>
	</body>
</html>

Open in new window

0
 
Geert BormansInformation ArchitectCommented:
From the Sarissa package, copy the sarissa.js and sarissa_ieemu.js files in a subdirectory script (or change the path in line 6 and 7 of the code I posted)

If I do over-rides in Ajax style in html pages, I always replace the innerHTML of an identified div

Two things you need to take care off
- <xsl:param name="continentID"/> requires to be a direct child of the xsl:stylesheet element
- the result of your xsl transform needs to be wellformed XML (so you need one root element)
I most always make this the first active template
<xsl:template match="/">
  <div>
    <xsl:apply-templates/>
 </div>
</xsl:template>

this creates an extra div, but at least you know the result is wrapped in a single root
also set the serialisation to xml explicitely
<xsl:output method="xml" indent="yes"/>
0
 
d1114170Author Commented:
Hi Gertone,
I wil have to try this out in the morning now as I am in the UK and have other commitments on a sunday evening.
Thank you very much and I will be in touch tomorrow morning.
0
 
Geert BormansInformation ArchitectCommented:
I am in CET, so I have an hour advantage, good luck tomorrow
0
 
d1114170Author Commented:
Morning Gertone,
I have just had a chance to aply about with the code you have given me and it seems fine, but is not displaying any of the xml data.
This, I am assuming is down to my poor xsl file?!
Obviously this does need a lot of work but at the moment I am just trying to get it to out put the correct data.
I'll attach what I have so far to see if you can improve it for me please.
Please also find attached a snippet of my xml code.
Thanks
<Offers>
	<Continent>
		<CID>A</CID>
		<Country>
			<Name><![CDATA[Canada ]]></Name>
			<Fare>
				<DestFrom>London Heathrow</DestFrom>
				<DestTo>Toronto  - Direct</DestTo>
				<BookBy>28/04/2009</BookBy>
				<TravelFrom>09/04/2009</TravelFrom>
				<TravelTo>17/06/2009</TravelTo>
				<Price>325</Price>
				<Eligibility>Everyone</Eligibility>
				<CallToAction>online</CallToAction>
				<Link><![CDATA[http://*****]]></Link>
				<Airline>British Airways</Airline>
				<LogoSRC>britishairways</LogoSRC>
				<freetext></freetext>
				<topoffer>True</topoffer>
				<topofferlink>http://***</topofferlink>
				<creationdate>08/08/09</creationdate>
			</Fare>

Open in new window

draft.txt
0
 
Geert BormansInformation ArchitectCommented:
Oh, I see what you are doing
The javascript should be driving the XSLT, the XSLT should not drive the javascript.
The code I send you is the HTML (with JavaScript that you need to open in the browser

So you need to put all the static information in the html file
and only the XML dynamic part should be driven by the XSLT
0
 
Geert BormansInformation ArchitectCommented:
Your XSLT should look more like this
<?xml version="1.0" encoding="utf-8" ?>
<xsl:stylesheet version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    
    <xsl:output method="xml" indent="yes"/>
    
    <xsl:variable name="sf_urlbase">http://www.*****</xsl:variable>
    <xsl:variable name="call_page_url"/>
    <xsl:variable name="logo_path">http://www.*******/images/xmlfares/logos/</xsl:variable>
    <xsl:variable name="blue_logo_path">http://www.*****/images/blue.png</xsl:variable>
    <xsl:variable name="sta_logopath"/>
    <!-- Texts -->
    <xsl:variable name="sf_prefix_rss_link">Get cheap flights for</xsl:variable>
    <xsl:variable name="sf_conjuncion_rss_link">as</xsl:variable>
    <!-- Product Table Elements -->
    <xsl:variable name="sf_destination">Destination</xsl:variable>
    <xsl:variable name="sf_airline">Airline</xsl:variable>
    <xsl:variable name="sf_travelrange">Travel Between</xsl:variable>
    <xsl:variable name="sf_book_by">Book By</xsl:variable>
    <xsl:variable name="sf_travel_between"/>
    <xsl:variable name="sf_eligibility">Eligibility</xsl:variable>
    <xsl:variable name="sf_price_from">From</xsl:variable>
    <xsl:variable name="sf_price_currency">£</xsl:variable>
    <xsl:variable name="sf_no_result">Currently there are no top fares available.</xsl:variable>
    <xsl:variable name="sf_button_phone">Call 0870 * *** ***</xsl:variable>
    <xsl:variable name="sf_button_online">Book Now</xsl:variable>
    <!-- Continents -->
    <xsl:variable name="sf_continent_a">North America</xsl:variable>
    <xsl:variable name="sf_continent_b">Europe</xsl:variable>
    <xsl:variable name="sf_continent_c">Asia</xsl:variable>
    <xsl:variable name="sf_continent_d">Australasia</xsl:variable>
    <xsl:variable name="sf_continent_e">Latin America</xsl:variable>
    <xsl:variable name="sf_continent_f">Africa</xsl:variable>
    <xsl:variable name="sf_continent_g">Middle East</xsl:variable>
    <xsl:variable name="sf_continent_h">Caribbean</xsl:variable>
    <xsl:variable name="sf_continent_i">Central America</xsl:variable>
    <xsl:variable name="sf_continent_default">Other Specials</xsl:variable>
    <xsl:template name="blue_image">
        <img alt="blue ticket" height="13" src="{$blue_logo_path}" width="31"/>
    </xsl:template>
    <xsl:variable name="continentID">A</xsl:variable>
    <xsl:variable name="continentDisp" select="Offers/Continent[CID=$continentID]" />
    
    <xsl:template match="/">
                <div>
                    <div class="Tab">
                        <a href="#" onclick="displayResult('All')">All</a>
                    </div>
                    <div class="Tab">
                        <a href="#" onclick="displayResult('A')">A</a>
                    </div>
                    <div class="Tab">
                        <a href="#" onclick="displayResult('B')">B</a>
                    </div>
                    <div class="Tab">
                        <a href="#" onclick="displayResult('C')">C</a>
                    </div>
                    <div class="TabDiv" id="continentTab">
                        <xsl:apply-templates select="Offers" />
                    </div>
                </div>
     </xsl:template>
    
    <xsl:template match="Offers">
        <xsl:call-template name="header" />
        <xsl:value-of select="$continentDisp"/>
    </xsl:template>
    
    <xsl:template name="header">
        <div class="Headers">
            <div class="tblHeader">
                <xsl:value-of select="$sf_destination"/>
            </div>
            <div class="tblHeader">
                <xsl:value-of select="$sf_airline"/>
            </div>
            <div class="tblHeader">
                <xsl:value-of select="$sf_travelrange"/>
            </div>
            <div class="tblHeader">
                <xsl:value-of select="$sf_book_by"/>
            </div>
            <div class="tblHeader">
                <xsl:value-of select="$sf_eligibility"/>
            </div>
            <div class="tblHeader">
                <xsl:value-of select="$sf_price_from"/>
            </div>
        </div>
    </xsl:template>
    
</xsl:stylesheet>

Open in new window

0
 
d1114170Author Commented:
Wow, thanks for the quick response.
I see. I am now running the html as instructed by yourself but am not getting xml data through?
0
 
Geert BormansInformation ArchitectCommented:
make sure all the paths are OK
- the paths to the Sarissa library files
- the paths to XML and XSL

Then you can take away the "//" in front of the allerts
so you can see if the XML and XSL files get properly loaded

Let me know what you see in the popup boxes
0
 
d1114170Author Commented:
Thank you.
The first box was empty so checked my xml and it was not pointing to my most up-to-date xml file.

Thanks for all your help.

Ill mark this as solution but may need help further down the line but will start a new trhead as you deserve the points.

Thanks Gertone.
0
 
Geert BormansInformation ArchitectCommented:
Welcome, don't hesitate to come back here if you need to
0
 
d1114170Author Commented:
ah, sorry.
I spoke too soon.

Although now it loads fine the variable does not change onlclick, it will just display what the variable is hardcoded as in the xsl. If the variable is blank then regardless of what button is clicked and what variable is passed it is blank?

sorry gertone.
0
 
Geert BormansInformation ArchitectCommented:
I don't think you have a
<xsl:param name="continentID"/>
in your XSLT at the top level
0
 
d1114170Author Commented:
perfect.

Thanks again.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.