[thelist] change the body of a Dreamweaver template?

[Sam-I-Am]

Jill, 
I know exactly what you are talking about, having been there. 
You want to add some script to just one page, but it's tied to a
template used for many pages. The body tag was not set as an editable
area, so although you can add your SCRIPT /SCRIPT content somewhere on
the page that is editable, you can't add the body onLoad event handler
you need to call functions in your script block.

There is a (cunning but tidy) way. Lets wrap this in a tip as it's a
handy one: 

<tip type="adding javascript event handlers" author="sam-i-am">

Lets say we want to ensure a certain function is called when the page
loads. That's a body onload event handler. In html you would just add
the attribute onload="functionCall()" to the body tag. But if you have
no access to the body tag for whatever reason. It might be locked up in
a CMS, or owned by someone else entirely, or maybe you already delivered
the html and just have the external js to work with. 

Work this code into your inline script block or external js file. 

First: we want to make sure we preserve any existing body onload
directives. 
(mind out for line wraps)

/* If an onload handler is already defined, we turn it into a string,
and add a ;. */
if(self.onload != null && self.onload != "undefined")
{
  var strOnLoad = self.onload.toString();
  var strNewOnLoad = strOnLoad.substring(strOnLoad.indexOf('{')
+1,strOnLoad.length -2) + '; ';
}

/* if not just initialise a empty string variable */
else {
	var strNewOnLoad = "";
}

/* now we add in the statements we want to get executed onload */
strNewOnLoad += 'alert("another function call added to the event handler
by an inline or external script");';
/* this could be 'init();' or whatever you like. */

/* Now we compile it all back into a usable function, and assign it to
the windows onload event handler */
self.onload = new Function(strNewOnLoad);

That's it. You might want to extend this further to check you don't get
caught in a loop adding stuff. But the essence of it is that you can
convert event handler statements into a string that you can modify at
will. And you can then convert them back into a function that will
execute as intended when the event occurs. 

I have this script working and documented at 
http://www.sam-i-am.com/misc/TestSuite/javascript/new_onLoad.html

You can use the same idea to add onMouseover events to links (by looping
through the links array for example). Whatever, this technique turns out
to be a neat way to create resuable encapsulated code, letting you keep
*all* the script in one file.

</tip>

Jill Shaw wrote:
> 
> Hey there folks
> This might be an easy one, but it has me stumped.
> 
> I have a template in Dreamweaver which is used by about 60 or so pages. In one page (only) I want to call a Javascript function with an onLoad command from the body tag. The page really needs to be tied to the template because the site is still at relatively early stages of development, but Dreamweaver wont let me mess with an uneditable region. I tried making the body tag of the template editable but then I get an ugly error in Design mode (of the Javascript closing comment) since the #EndEditable part of the code is after the body tag. Should I just run with this or is there something else I could try.
> 
> Thanks in advance,
> Regards, Jill
> --