Solved

Using javascript in head tag does not work

Posted on 2008-06-25
12
474 Views
Last Modified: 2012-08-13
Hello experts.
I'm using a script for popupwindow.
When i use the script in the body it is working but only in firefox.Explorer don't open the page.
If i put the script in the head tag then it does not work.
The script is:
<script type="text/javascript">
win1 = new Window('1', {className: "alphacube", title: "", width:150, height:40, top:150, left:300}); win1.getContent().innerHTML = "Please select";
</script>
And the image i click on:
<a href="#" onClick="win1.show();"><img src="img/pop.gif"  border="0"/></a>
(I'm using coldfusion 8)
0
Comment
Question by:Panos
  • 6
  • 6
12 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 21866501
What is Window doing? I ask because in this:
win1.getContent().innerHTML = "Please select";

I would expect win1.getContent() to return a string, not a DOM object, in which case the .innerHTML will have no effect.
0
 
LVL 2

Author Comment

by:Panos
ID: 21866950
hello hielo again.
I have downloaded the files from here:http://prototype-window.xilinus.com/
I send you all the files so you can see better what is going on.
download the js. files from here :
http://prototype-window.xilinus.com/download.html
I can't upload them
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

<link href="Stylesheet/themes/default.css" rel="stylesheet" type="text/css"> 

<!-- Add this to have a specific theme--> 

<link href="Stylesheet/themes/alphacube.css" rel="stylesheet" type="text/css">

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

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

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

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

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

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

<script type="text/javascript">

win1 = new Window('1', {className: "alphacube", title: "", width:150, height:40, top:150, left:300}); win1.getContent().innerHTML = "Please select";

</script>

</head>
 

<body><table cellspacing="0" cellpadding="0">

  <tr>

    <td>&nbsp;</td>

    <td><a href="#" onClick="win1.show();"><img src="img/hinweis.gif"  border="0"/></a></td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

</table>
 
 

</body>

</html>

Open in new window

0
 
LVL 82

Expert Comment

by:hielo
ID: 21867063
The example on that page shows the following syntax:
win1.getContent().update("Please select");

0
 
LVL 2

Author Comment

by:Panos
ID: 21867115
Is this wrong?
0
 
LVL 82

Accepted Solution

by:
hielo earned 500 total points
ID: 21867285
The attached code worked for me in IE. Make sure you are providing the right path to the css. Notice that I used http://prototype-window.xilinus.com/themes/alphacube.css, but you will need to make a copy of that css to your server as well as the images that the css references.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

<link href="Stylesheet/themes/default.css" rel="stylesheet" type="text/css"> 

<!-- Add this to have a specific theme--> 

http://prototype-window.xilinus.com/javascripts/prototype.js

<link href="http://prototype-window.xilinus.com/themes/alphacube.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/TOOLTIP.js"> </script>

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/prototype.js"> </script> 

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/effects.js"> </script> 

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/window.js"> </script> 

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/window_ext.js"> </script> 

<script type="text/javascript" src="http://prototype-window.xilinus.com/javascripts/debug.js"> </script>

<script type="text/javascript">

win1 = new Window({className: "alphacube", width:350, height:400, zIndex: 100, resizable: true, title: "Sample window", showEffect:Effect.BlindDown, hideEffect: Effect.SwitchOff, draggable:true, wiredDrag: true}); 

win1.getContent().update("Please select");

</script>

</head>

 

<body><table cellspacing="0" cellpadding="0">

  <tr>

    <td>&nbsp;</td>

    <td><a href="#" onClick="win1.show();"><img src="http://prototype-window.xilinus.com/img/hinweis.gif"  border="0"/></a></td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

  <tr>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

  </tr>

</table>

 

 

</body>

</html>

Open in new window

0
 
LVL 2

Author Comment

by:Panos
ID: 21867574
When i delete the :
http://prototype-window.xilinus.com/javascripts/prototype.js on line 8 than it is not working.Is this normal?
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 82

Expert Comment

by:hielo
ID: 21867657
That "tool" is depending on the prototype library, so if you delete it then it shoud NOT work. You don't HAVE to link your page to the one on xilinus.com - you can save a copy of the needed file to your server and have you page link to your copy instead.
0
 
LVL 2

Author Comment

by:Panos
ID: 21867762
Do you mean to save the file as prototype.js as i already have in my folder js and than link there?
0
 
LVL 82

Expert Comment

by:hielo
ID: 21868375
>>Do you mean to save the file as prototype.js
Yes. It's possible that your version and the version on that site are different.
0
 
LVL 2

Author Comment

by:Panos
ID: 21872528
Hi hielo again.
You believe it or not :I'm going to this site:
http://prototype-window.xilinus.com/javascripts/prototype.js
I copy the code prototype code  there.
Then i put this code in my prototype.js file (i have deleted the old one).
I make a link like :<script type="text/javascript" src="js/prototype.js"> </script> (js is the folder with the other javascript codes and they are working!) and it is not working.
I checked also the sample files i downloaded with all the code.
For example the code from the example:window_store.html
 is working in firefox and explorer,but when i cut the script files in the body and put them in the head i get the errors in the firefox error-check:
this.options.parent is null (from windows.js line 629)
<html>
 

<head>

<title>WindowStore example</title>

<script type="text/javascript" src="../javascripts/prototype.js"> </script> 

<script type="text/javascript" src="../javascripts/effects.js"> </script> 

<script type="text/javascript" src="../javascripts/window.js"> </script> 

<script type="text/javascript" src="../javascripts/window_ext.js"> </script> 

<script type="text/javascript" src="../javascripts/debug.js"> </script> 
 

<link href="../themes/default.css" rel="stylesheet" type="text/css"> 

<!-- Add this to have a specific theme--> 

<link href="../themes/alphacube.css" rel="stylesheet" type="text/css"> 
 
 

</head>
 

<body>

<b>My personal configuration of the windows:</b><br>

<br>

<br>

<br>

<br>

<br>

<br>

<center><a href="#" onClick="win1.show();">open window1</a></center>

<center><a href="#" onClick="win2.show();">open window2</a></center>

<center><a href="#" onClick="win3.show();">open window3</a></center>

<center><a href="#" onClick="win4.show();">open window4</a></center>
 

<script type="text/javascript">

win1 = new Window('1', {className: "alphacube", title: "Sample1", width:200, height:150, top:70, left:100}); win1.getContent().innerHTML = "<h1>1</h1>";

</script>
 

<script type="text/javascript">

win2 = new Window('2', {className: "alphacube", title: "Sample2", width:200, height:150, top:270, left:100}); win2.getContent().innerHTML = "<h1>2</h1>";

</script>
 

<script type="text/javascript">

win3 = new Window('3', {className: "alphacube", title: "Sample3", width:200, height:150, top:270, left:400}); win3.getContent().innerHTML = "<h1>3</h1>";

</script>
 

<script type="text/javascript">

win4 = new Window('4', {className: "alphacube", title: "Sample4", width:200, height:150, top:70, left:800}); win4.getContent().innerHTML = "<h1>4</h1>"; 

WindowStore.show(win4);

WindowStore.init();

</script>

</body>
 

</html>

Open in new window

0
 
LVL 82

Expert Comment

by:hielo
ID: 21879225
Try providing the full url to your files. Intead of:
src="..."

use:
src="http://www.yoursite.com/yourfolder/file.js"
0
 
LVL 2

Author Closing Comment

by:Panos
ID: 31470569
Hi hielo.
I made what you said.I did use exactly the the same folders and files in my site like the examples.For a simple page it did work.I had problems with pages from templates.The problem was not the links.After testing and testing i found out that i had to put the scripts: <script type="text/javascript">
win1 = new Window('1', {className: "alphacube", title: "Sample1", width:200, height:150, top:70, left:100}); win1.getContent().innerHTML = "

1

";
</script> in the bottom of the page just before the .Now it is working.
That what i was saying with the link, i have really recorded it and if you want you can see it.
Thank you for your help again.
Regards panos.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now