How To Include Client-Side Script Functions in an XSL Document (273793)

SUMMARY

When you return HTML from an XML/XSL transform, you often have to return SCRIPT blocks. For example:

<SCRIPT LANGUAGE="javascript">
       function someFunction()
       {
             //Your code here.
       }
</SCRIPT>

This article describes how you can include the DEFER attribute for the <SCRIPT> tag when you include a script function in an XSL document that is used in a client-side XML/XSL transform.

NOTE: You only need the DEFER attribute when you manually perform the XML/XSL transform in client-side script. You do not need this attribute in a server-side XML transform, or if the transform is performed when navigating to a static XML file that links to the XSL document.

MORE INFORMATION

If you do not include the DEFER attribute for the <SCRIPT> tag, and the function is called from the transformed document, an "Object Expected" error occurs.

In addition, you must enclose the SCRIPT block in <xsl:comment> tags and a CDATA section. If you do not wrap the script in a CDATA section, the XML parser parses the contents of the SCRIPT block. Because script can contain reserved characters, such as "<" and ">", the CDATA section protects the parser from potentially invalid XML within the SCRIPT block.

Sample Code

NOTE: Make sure that you save the following files in the same folder.

Create a new XML file named Xmldoc.xml, and then paste the following code:

<?xml version="1.0"?>
	<nodes>
		<node>Hello</node>
		<node>World</node>
	</nodes>

Create a new XSL file named Xsldoc.xsl, and then paste the following code:

  <?xml version="1.0"?> 
  <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/TR/WD-xsl">
  <xsl:template match="/">
  <HTML>
   <BODY>
    <SCRIPT LANGUAGE="javascript" DEFER="true">
     <xsl:comment>
      <![CDATA[ 
	function hiLite()
 	 {
	   alert("hello");
   	 }
      ]] > 
    </xsl:comment>
    </SCRIPT>
   <INPUT id="BUTTON1" name="BUTTON1" onclick="hiLite()" type="button" value="aTest"/> 
   </BODY>
  </HTML>
  </xsl:template>
  </xsl:stylesheet>

IMPORTANT: For the preceding code to work in Internet Explorer, you must delete the space between the bracket (]) and the greater-than symbol (>) in the following line:

      ]] >

It was necessary to include this space to format the code in this article.

Create a new HTML file named Demo.htm, and then paste the following code:

<html>
<head>
<SCRIPT language="JavaScript">
<!-- begin script
function transformDoc()
{
	var	xmldoc	 =	new ActiveXObject("Microsoft.XMLDOM");
	var	xsldoc	 =	new ActiveXObject("Microsoft.XMLDOM");
			
	xmldoc.async =	false;
	xsldoc.async =	false;
			
	xmldoc.load('xmldoc.xml');
	xsldoc.load('xsldoc.xsl');
			
	if((xmldoc.parseError.errorCode == 0) && (xsldoc.parseError.errorCode ==0))
		document.body.innerHTML = xmldoc.transformNode(xsldoc);
	else
	{
		document.body.innerHTML	= 'Reason: ' + xmldoc.parseError.reason;
		document.body.innerHTML	+='<br>' + 'Reason: ' + xsldoc.parseError.reason;
	}
}
//-->
</script>
</head>
<body>
<input type=button onclick="transformDoc()" value="Transform">	
</body>
</html>

In Internet Explorer, open Demo.htm, and then click Transform.
To fire the function that is applied to the document from the transformation, click Test Scripting. A button with lable aTest is displayed.
To fire the function, click aTest. An alert is displayed.

REFERENCES

For more information on the SCRIPT element, see the following Microsoft Developer Network (MSDN) Web site:

http://msdn.microsoft.com/workshop/author/dhtml/reference/objects/script.asp

For more information about XML, see the XML Reference at the following MSDN Web site:

http://msdn.microsoft.com/library/psdk/xmlsdk/xml_9yg5.htm

For more information about Microsoft Windows Script Technologies, see the following MSDN Web site:

http://msdn.microsoft.com/scripting/

For more information about developing Web-based solutions for Microsoft Internet Explorer, visit the following Microsoft Web sites:

http://msdn.microsoft.com/ie/

http://support.microsoft.com/iep