Tech Help - providing the average home user with valuable information and tips on topics such as computers, the internet, and home electronics
Passing XSLT Parameters with JavaScript and HTML
Passing dynamic parameters to an XSLT document in real-time with a Javascript HTML combination
March 3, 2006
Peter Davis
A little while ago I was trying to figure out how I was going to create a dynamic webpage, based on a selection a user made, which would have to be determined using JavaScript. I know it's a mouthful but I did find a solution.

This tutorial assumes you already know how to create XML and XSLT files and understand how these two work together to produce HTML output.

If you're looking for a nice XML editor I suggest you try XML Writer

The First Problem
I'll try to set this up as easy as possible, so let's assume that this is a website about fruit. The user can select the fruits their interested in and then click next to see information on those fruits. The first problem is that I can't use PHP, or any type of real database.
The First Solution
I decided that I would use XML and XSLT to work this problem out. The XML would hold all the information about the fruits and the XSLT file would dynamically generate the HTML for the fruit their interested in. All [good] browsers today can do this transformation automatically.
Second Problem
I won't know beforehand which fruits the user will select so how can I generate an HTML output page with their fruit selections without somehow checking to see which fruits they selected. This has to be done at runtime.
The Second Solution
I know from previous experience that you can pass parameters to an XSLT file before performing the transformation but this would need to be performed via a browser which is another challenge.

Fortunately, I was able to find JavaScript code that instantiates an XSLT processor which will allow you to set parameters for the XSLT file. Now I just needed to put it all together.

Page: 1 of 3
You can submit your own article and have it published on Tech Help. Click on the link above for more details