PDA

View Full Version : javascript in XSL templates in IE


The Reverend
08-13-2006, 02:31 AM
I use a drop down menu on my site that has many XML pages and use a XSL template to make it look like the rest of site. On other pages the drop down works fine. In FF it works fine. In IE it doesn't work at all.

<script type="text/javascript">
<!--
// CSS Top Menu- By JavaScriptKit.com (http://www.javascriptkit.com)
// Adopted from SuckerFish menu
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// Please keep this credit intact
startMenu = function() {
if (document.all&&document.getElementById) {
cssmenu = document.getElementById("csstopmenu");
for (i=0; i<cssmenu.childNodes.length; i++) {
node = cssmenu.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function(){
this.className=this.className.replace(" over", "")
}
}
}
}
}

if (window.attachEvent)
window.attachEvent("onload", startMenu)
else
window.onload=startMenu;
-->
</script>


I'm stumped and this is a pretty big problem, can anyone help me?

jkd
08-13-2006, 03:05 AM
You should probably post the entire XSLT document because that script tag alone isn't enough to debug, unless it has to do with the onload event firing with an XSLT transform (possibly? In IE, after loading the page, try javascript:void(startMenu()) in the location bar. Also, post an JS errors that pop up.)

The Reverend
08-13-2006, 03:10 AM
How do you find IE Javascript errors? I don't use it enough to know.

<?xml version="1.0" encoding="iso-8859-1" ?>
- <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="iso-8859-1" doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" />
- <xsl:template match="hrpages">
- <html>
- <head>
- <script type="text/javascript">
- <!--
// CSS Top Menu- By JavaScriptKit.com (http://www.javascriptkit.com)
// Adopted from SuckerFish menu
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// Please keep this credit intact
startMenu = function() {
if (document.all&&document.getElementById) {
cssmenu = document.getElementById("csstopmenu");
for (i=0; i<cssmenu.childNodes.length; i++) {
node = cssmenu.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function(){
this.className=this.className.replace(" over", "")
}
}
}
}
}

if (window.attachEvent)
window.attachEvent("onload", startMenu)
else
window.onload=startMenu;


-->
</script>
<style type="text/css">body { font-family:Arial, Helvetica, sans-serif; } ul {list-style: none;} li {text-align:left;} #csstopmenu { margin:0 auto; padding:0; list-style:none; width:800px; } #csstopmenu ul{ padding: 0; margin: 0; list-style: none; z-index: 1; } #csstopmenu li{ float: left; position: relative; z-index: 1; } #csstopmenu a:hover{ text-decoration: none; color:#000000; } #csstopmenu a{ text-decoration: none; } .mainitems{ border: 1px solid #000000; border-left-width: 0; background-color: #dda0dd; width:158px; } .headerlinks { font-weight: bold; font-size: 14px; color: #000000; width:100%; display:block; text-align:center; } .headerlinks a{ font-weight: bold; font-size: 14px; color: #000000; width:100%; display:block; text-align:center; } .submenus{ display: none; width:100%; position: absolute; top: 1.2em; left: 0; background-color: #dda0dd; border: 1px solid #000000; } .submenus li{ width: 100%; } .submenus li a{ display: block; width: 100%; text-indent: 3px; color: #000000; } html>body .submenus li a{ /* non IE browsers */ width: auto; } .submenus li a:hover{ background-color: #cc00cc; color:#000000; } #csstopmenu li>ul {/* non IE browsers */ top: auto; left: auto; } #csstopmenu li:hover ul, li.over ul { display: block; } html>body #clearmenu{ /* non IE browsers */ height: 3px; } #hrlisting { list-style:inside; }</style>
- <title>
<xsl:value-of select="title" />
</title>
- <script type="text/javascript">
- <!--
var Contact;
function openContact() {
Contact = window.open("contact.php", "", "height=260,width=450");
}


-->
</script>
</head>
- <body style="background-image:url('stl.gif');">
- <table align="center" style="background-color:#dda0dd; border:medium; border-style:groove;">
- <tr>
- <td>
- <div style="width:800px; padding:10px;">
- <center>
- <a href="index.php">
<img src="http://i1.tinypic.com/ncmq8i.jpg" alt="Welcome to HRPages.net" />
</a>
</center>
<br />
- <ul id="csstopmenu">
- <li class="mainitems" style="border-left:1px; border-left-style:solid;">
- <div class="headerlinks">
<a href="index.php">Home</a>
</div>
</li>
- <li class="mainitems">
<div class="headerlinks">Helpful organizations</div>
- <ul class="submenus" style="width: 14em">
- <li>
<a href="index.php?p=nco">National & CA Oranizations</a>
</li>
- <li>
<a href="support.xml">Support Groups</a>
</li>
- <li>
<a href="isp.xml">Independent Study Programs</a>
</li>
</ul>
</li>
- <li class="mainitems">
<div class="headerlinks">Help for Parents</div>
- <ul class="submenus" style="width: 12em">
- <li>
<a href="news.xml">News, Events & Additions</a>
</li>
- <li>
<a href="calendar.php">Calendar</a>
</li>
- <li>
<a href="index.php?p=build">Building your homechool</a>
</li>
- <li>
<a href="index.php?p=law">Homeschooling & Law</a>
</li>
- <li>
<a href="sup.xml">Cirriculum Suppliers</a>
</li>
- <li>
<a href="magnew.xml">Magazines & Newsletters</a>
</li>
- <li>
<a href="ir.xml">Internet Resources</a>
</li>
- <li>
<a href="enrich.xml">Enrichment</a>
</li>
- <li>
<a href="mus.xml">Local Museums</a>
</li>
- <li>
<a href="tresources.xml">Teacher's Resources</a>
</li>
- <li>
<a href="hscol.xml">High School & College</a>
</li>
- <li>
<a href="bd.xml">Business Directory</a>
</li>
</ul>
</li>
- <li class="mainitems">
<div class="headerlinks">Classes & Activities</div>
- <ul class="submenus" style="width: 12em">
- <li>
<a href="class.xml">Classes & Training</a>
</li>
- <li>
<a href="sps.xml">Support Programs & Schools</a>
</li>
- <li>
<a href="enrich.xml">Enrichment</a>
</li>
- <li>
<a href="sam.xml">Sports, Art & Music</a>
</li>
- <li>
<a href="active.xml">Continuing Activities</a>
</li>
</ul>
</li>
- <li class="mainitems">
<div class="headerlinks">About Us</div>
- <ul class="submenus">
- <li>
<a href="index.php?p=us">This Site</a>
</li>
- <li>
<a href="#" onclick="window.open('contact.php', '', 'height=260,width=450')">Contact Us</a>
</li>
</ul>
</li>
</ul>
<br />
<br />
</div>
- <div style="width:800px; padding:10px; border-left:thin; border-left-style:inset; border-right:thin; border-right-style:inset;">
- <span style="font-size:32px; text-align:center;">
<xsl:value-of select="title" />
</span>
<br />
<br />
- <div>
<xsl:value-of select="description" />
</div>
<br />
- <ul id="hrlisting">
- <xsl:for-each select="item">
- <xsl:if test="category">
<br />
- <b>
- <span style="font-size:26px;">
<xsl:value-of select="category" />
</span>
</b>
<br />
<br />
</xsl:if>
- <xsl:if test="name">
- <li>
- <span style="font-size:14px;">
- <b>
<xsl:value-of select="name" />
:
</b>
<xsl:value-of select="desc" />

- <xsl:if test="contact">
- <b>
Contact:
<xsl:value-of select="contact" />
</b>

</xsl:if>
<xsl:value-of select="address" />

<xsl:value-of select="phone" />

- <a>
- <xsl:attribute name="href">
mailto:
<xsl:value-of select="email" />
</xsl:attribute>
<xsl:value-of select="email" />
</a>

- <b>
<xsl:value-of select="secondcontact" />
</b>

<xsl:value-of select="secondphone" />

- <a>
- <xsl:attribute name="href">
mailto:
<xsl:value-of select="secondemail" />
</xsl:attribute>
<xsl:value-of select="secondemail" />
</a>
<br />
- <a>
- <xsl:attribute name="href">
<xsl:value-of select="url" />
</xsl:attribute>
<xsl:value-of select="url" />
</a>
</span>
</li>
</xsl:if>
</xsl:for-each>
</ul>
<xsl:value-of select="footer" />
</div>
- <div align="center" style="width:800px; padding:10px;">
- <span style="font-size:10px">
if you have any questions or concerns, please e-mail us at
<a href="mailto:hrpages@earthlink.net">hrpages@earthlink.net</a>
</span>
<br />
© 2005, 2006 HRP of Santa Clara County
<br />
Updated
<xsl:value-of select="updated" />
</div>
</td>
</tr>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

I don't know if this helps much or not, XML/XSL is fairly new to me.