Solved

Problem writing a script block to an IFrame

Posted on 2003-10-29
18
426 Views
Last Modified: 2008-02-26
Hello,

I need to dynamically write a script block to an IFrame. Unfortunately the script block is not executed. Here is the code: The first document.write works as expected, but the "Hello form Script" message never appears. Does anybody know what's wrong with my code?

Thank you for you help!


<HTML>
      <HEAD>
            <script id="clientEventHandlersJS" language="javascript">
<!--

function Button1_onclick() {
      var myIFrameDoc=IFrame.document;
            
      myIFrameDoc.designMode="on";
      myIFrameDoc.open();
      myIFrameDoc.write("Hello");
      myIFrameDoc.write("<script>alert('Hello from Script');</script>");            
      myIFrameDoc.close();                        
}

//-->
            </script>
      </HEAD>
      <body>
            <P>
                  <iframe id="IFrame" style="WIDTH:400px;HEIGHT:300px"></iframe></P>
            <P>
                  <INPUT id="Button1" type="button" value="Button" name="Button1" language="javascript" onclick="return Button1_onclick()">
            </P>
      </body>
</HTML>
0
Comment
Question by:fallerai
  • 7
  • 6
  • 3
  • +1
18 Comments
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9641005
fallerai,
Why dont you eliminate document.write() within the alert() function?
Just use alert() functions to execute alert() message.

Instead of
myIFrameDoc.write("<script>alert('Hello from Script');</script>");  
Change to
alert('Hello from Script');

Regards
x_com  
0
 
LVL 12

Expert Comment

by:ahosang
ID: 9641309
The two successive calls to document.write is the problem. The best way to do this sort of thing is to build up a string and then write it all at once.
function Button1_onclick() {
     var myIFrameDoc=IFrame.document;
         
     myIFrameDoc.designMode="on";
     var str="Hello";
     str+="<sc"+"ript>alert('Hello from Script');</sc"+"ript>";          
     myIFrameDoc.write(str);
     myIFrameDoc.close();                    
}
0
 
LVL 12

Expert Comment

by:ahosang
ID: 9641326
Some of what I said wasn't right. But in any case, the code should work. Always break up <script> tags in javascript strings.
0
What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

 

Author Comment

by:fallerai
ID: 9641382
Hello,

thank you for your comments so far. Unfortunately I still could not solve the problem

@x_com: The alert message embedded in the script block is just an example. This can be replaced with any other Java Script.

@ahosang: I changed the code as you habe suggested, but the Messagebox still does not pop up.
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9641448
fallerai ,
Just want to mention somethings here, if you want to output somethings, document.write(0 should do the trick. But, if you want to pop up any alert() message, why don't you just use build in messagebox function?
>>This can be replaced with any other Java Script.
-now you're functions already in javascript....
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9641504
If you only want to pop up a message, try this :
myIFrameDoc.write("<script>alert('Hello from Script');</script>");      
change to
myIFrameDoc.write(alert('Hello from Script'));      
-but after click ok, you will get 'undefine" items, simply remove it afterward.
0
 

Author Comment

by:fallerai
ID: 9641590
Some more background:

When I split up the above code in two html-pages and load the IFrame with the help of the scr-Attribute then it works as expected: A page with an IFrame displayed the Hello string is displayed and the Messagebox pops up.

PageWithIFrame.htm:

<HTML>
      <body>
            <iframe id="IFrame" src="IFrameS.htm" style="WIDTH:400px;HEIGHT:300px"></iframe>
      </body>
</HTML>

IFrameContent.htm:

<HTML>
      <body>
            Hello
            <script>alert('Hello from Script');</script>
      </body>
</HTML>

But when I load the content dynamically to the IFrame like I posted in my question the Script block ist not executed. The Messagebox is not shown.

The content which is loaded in the IFrame will be a complex html page wich includes lot of JavaScript. I need to load the content dynamically to the IFrame, because it is not known in advance. Another solution would be to gernerate a html-page on the fly and refernece it with the IFrame src attribute. But I think this is not possible on the client side. I can not use server side functionality for this solution.
0
 

Author Comment

by:fallerai
ID: 9641628
There is a mistake in the example above

It sould look like this:

PageWithIFrame.htm:

<HTML>
     <body>
          <iframe id="IFrame" src="IFrameContent.htm" style="WIDTH:400px;HEIGHT:300px"></iframe>
     </body>
</HTML>

IFrameContent.htm:

<HTML>
     <body>
          Hello
          <script>alert('Hello from Script');</script>
     </body>
</HTML>
0
 

Author Comment

by:fallerai
ID: 9642774
I finally found the solution :) and want to share it with you. The problem was the line myIFrameDoc.designMode="on";

I thought it is necessary to set this Attribute to make it possible to write content  to the IFrame. But it is actually not necessary. Moreover it prevents the execution of JavaScript.

Since I removed that line everything works as expected:

Final solution:

<HTML>
     <HEAD>
          <script id="clientEventHandlersJS" language="javascript">
<!--

function Button1_onclick() {
     var myIFrameDoc=IFrame.document;
         
     myIFrameDoc.open();
     myIFrameDoc.write("Hello");
     myIFrameDoc.write("<script>alert('Hello from Script');</script>");          
     myIFrameDoc.close();                    
}

//-->
          </script>
     </HEAD>
     <body>
          <P>
               <iframe id="IFrame" style="WIDTH:400px;HEIGHT:300px"></iframe></P>
          <P>
               <INPUT id="Button1" type="button" value="Button" name="Button1" language="javascript" onclick="return Button1_onclick()">
          </P>
     </body>
</HTML>
0
 

Author Comment

by:fallerai
ID: 9642800
I am a new user of this site. How can I close this Q/A. I can not find how to do this.
0
 
LVL 15

Assisted Solution

by:VincentPuglia
VincentPuglia earned 50 total points
ID: 9642803
works for me  (i changed the Iframe id, probably not necessary, but...

function Button1_onclick() {
     theFrame.document.write("<html><script>function doit(){alert('Hello from Script');} window.onfocus= doit()</script><body>Hello</body><script>alert(1)</script></html>")
}
<iframe id="theFrame" style="WIDTH:400px;HEIGHT:300px"></iframe></P>

there is a difference between
document.write
and
IFrameDoc.write

Vinny
0
 
LVL 29

Accepted Solution

by:
David H.H.Lee earned 450 total points
ID: 9642820
fallerai,
I got it, simply remove myIFrameDoc.designMode="on".
That's i found it. It pretty easy too.
 
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9642829
oppps, late response. Cache problems.......:-(
No luck!
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9642849
fallerai ,
You can post a thread at CS area. Ask the admin to close the question with Points Refund.
In that thread, add refer :
http://oldlook.experts-exchange.com/Web/Web_Languages/JavaScript/Q_20781542.html

Regards
x_com
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 9642910
For those who are still reading

interestingly enough, the onload event handler does not exectue -- possibly because the page isn't 'loaded'

function Button1_onclick()
{
theFrame.document.write("<html><script>function doit(){alert('Hello from Script');} </script> <body onload= doit()>Hello</body> <script>alert(1)</script></html>")

  var myIFrameDoc=theFrame.document;
  myIFrameDoc.designMode="on";
   
}
0
 

Author Comment

by:fallerai
ID: 9642938
@x_com I seems we have found the solution in just the same moment :) But insted of refunding the points you will get some :) Thank you for you help!!!
0
 
LVL 29

Expert Comment

by:David H.H.Lee
ID: 9642986
fallerai , thanks...still got luck..

Regards
x_com
0
 
LVL 15

Expert Comment

by:VincentPuglia
ID: 9643012
fallerai -- if you still want the designMode, look at my solution
0

Featured Post

Enterprise Mobility and BYOD For Dummies

Like “For Dummies” books, you can read this in whatever order you choose and learn about mobility and BYOD; and how to put a competitive mobile infrastructure in place. Developed for SMBs and large enterprises alike, you will find helpful use cases, planning, and implementation.

Question has a verified solution.

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

Today I would like to talk about localizing (Internationalization) JavaScript applications. Introduction When creating an application that is going to be used by many people around the globe, it is important to remember that not everyone speak…
In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
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…

832 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