code in body tag causing JS to fail.

Forum Moderators: open

Message Too Old, No Replies

code in body tag causing JS to fail.

stonewall

5:34 pm on Feb 8, 2010 (gmt 0)

Ive recently been appointed to do some work on my employers website. For now, to hold us over until we can manage a complete re-write, I have been asked to just do a little update to the look and feel. One of the things I have done is use the niftycorners code for rounded divs.

I have had no trouble implementing this code over all the site pages, until I got to one page. Our product pages.

Ive never seen a code placed directly within the body tag, but this is what has been done here.

<BODY onload="pricing_init(); attribute_changed();">

This code loads the dynamic pricing feature. Unfortunately, it also causes the nifty corners code I have placed between the head tags to fail.

I dont know if its just the odd placement of the code or the code itself as I am just learning js (using the Javascript and Ajax for dummies book). Is there some way I can alter this so that both the dynamic pricing and nifty corners works?

thanks in advance for any suggestions.

rocknbil

6:26 pm on Feb 8, 2010 (gmt 0)

The first stop is to validate the page [validator.w3.org]. Invalid HTML can cause JS to fail in many cases. Don't let it scare you, often a single validation error cascades down to others that are not really errors. An example might be a missing closing tag on a </div>. Unrelated errors are likely to be ones that have ampersands & that need to be changed to entities &.

Second stop: install and learn to use the FireFox Error Control panel. It's usually pretty specific about what's causing the errors and will help a lot - help you locate the source of the error, help members here suggest changes.

After that, if it's still broken, we'll need to see some code.

The inline body handler is pretty common, though it is always better to externalize them, something like this:


<head> <!-- ect. --> 
<script type="text/javascript"> 
window.onload=function() { 
 pricing_init(); 
 attribute_changed(); 
}; 
</script> 
</head> 
<body> <!-- etc. -->

But don't do that yet, as I don't think that's the problem.

stonewall

6:35 pm on Feb 8, 2010 (gmt 0)

I know all about validation and no, the pages do not validate, but I have already been told not to bother with them. Im being told its a waste of time and money to clean up the current code, so nothing I can do about it really, but do I know for a fact this is what is causing the problem, because when I remove it, the nifty corners js works fine. Im suspecting the problem is laying in the fact that they are both using the onload command. The nifty corner js is as follows and is placed within the header.

<script type="text/javascript" src="JS/niftycube.js"></script>

<script type="text/javascript">
window.onload=function(){
Nifty("div#container,div#header,div#nav,div#footer,div#maincontent,","normal");
}
</script>

Fotiman

6:36 pm on Feb 8, 2010 (gmt 0)

Actually, I suspect that it IS the problem. If your niftycorners code does this:

window.onload = ...;

And then you do <body onload="...";>, only one of those is going to execute. You would need to combine those onload handlers into a single hander.

Fotiman

6:39 pm on Feb 8, 2010 (gmt 0)

Ok, change your second script to this:

<script type="text/javascript">
window.onload=function(){
Nifty("div#container,div#header,div#nav,div#footer,div#maincontent,","normal");
pricing_init();
attribute_changed();
}
</script>

And then remove the onload event handler from the body tag.

stonewall

6:54 pm on Feb 8, 2010 (gmt 0)

Thanks so much for the help, I figured it would be something simple but without much experience I am pretty clueless.

Im unable to test this at the moment due to server maintenence (and asp pages will not load properly on my local computer) but i'll try it out asap.