Passing XSLT Parameters with JavaScript and HTML

HTML: Finally you need to setup the HTML file that will call the transformation function and pass along the proper parameters.

Note: If the JavaScript above is in a separate file then you'll obviously need to include a reference to it in order to make this work.

For this example, let's assume that the selections made by the user have been pulled out and are held by the fruitList array.

Next you'll need a DIV element with an id, for this example will call the id 'results'. So it would look like <DIV id="results"></DIV>

Finally, you'll need to add the JavaScript to call the transform function, passing in the required parameters. We'll assume that the fruits XML and XSLT file are in the same location as the HTML file. See Figure 3

Figure 4: Transformation Call

Well Oiled Machine

In the end, the user will select the fruits their interested in. Using JavaScript one can determine which fruits the user selected and place them in an array. Next, you call the transformation function making sure to pass along the XML, XSLT, the DIV you want to update and the list of fruits in an array. The transformation function will set the parameters for the XSLT file and perform the transformation. The output from the transformation will placed in the DIV element you specified. Voila!