?
Solved

refresh Iframe using javascript

Posted on 2007-08-08
16
Medium Priority
?
1,551 Views
Last Modified: 2013-11-05
Hi  - Thanks for looking at my question :)

I would simply like to refresh the Iframe in my page when the page loads.

I have tried this but it does not work...

<Body onload="document.getElementById("ScrollerFrame").location.reload();">

Any ideas?

Thanks

PDM
0
Comment
Question by:Pigdogmonster
  • 8
  • 7
16 Comments
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 120 total points
ID: 19654116
onLoad="window.frames['ScrollerFrame'].location.reload(1)"

assuming
<iframe NAME="ScrollerFrame">

watch the quotes
0
 

Author Comment

by:Pigdogmonster
ID: 19654148

This is what I have... (it this does not work ;))

<body onload="document.getElementById('ScrollerFrame').location.reload();">

 <iframe  id="ScrollerFrame" name="ScrollerFrame" allowtransparency="true" scrolling="no" marginheight="0" frameborder="0" align="middle" height="35px" width="100%" src="pages/Request_Form/testform.asp">

</iframe>
           
0
 
LVL 30

Expert Comment

by:third
ID: 19654218
try this. you will see the alert will show twice - first on initial load and when reloaded by the onload event of the parent page.

<body onload="document.getElementById('ScrollerFrame').src=document.getElementById('ScrollerFrame').src">

 <iframe  id="ScrollerFrame" name="ScrollerFrame" allowtransparency="true" scrolling="no" marginheight="0" frameborder="0" align="middle" height="135px" width="100%" src="http://www.google.com" onload="alert('loaded');">

</iframe>
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19654269
Try mine
0
 

Author Comment

by:Pigdogmonster
ID: 19654393
Thanks,

It does not seem to work onLoad.

I have tried it in a button and it works...

<input type="button" onclick="window.frames['ScrollerFrame'].location.reload(1)" value="Refresh">

any ideas?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19654999
try it in Firefox and see what the console tells you.

Perhaps it is just IE that does not have the iframe when the onLoad triggers
0
 

Author Comment

by:Pigdogmonster
ID: 19655130
Just noticed that it works in IE7 but not in IE6.

This is a real pain as the people that will be using this site will be a mixture of IE6 and IE7 only.
Do you know of any other way to trigure this event?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19655238
Perhaps play with this


<script>
var loaded=false;
</script>
<iframe....></iframe>
<script>
var loaded=false;
 if (document.onreadystatechange)
window.frames["ScrollerFrame"].document.onreadystatechange = function() {
    if (readyState == 4 && !loaded) { loaded = true;  window.frames["ScrollerFrame"].location.reload(1) }    
}
</script>
0
 

Author Comment

by:Pigdogmonster
ID: 19660516
hey mplungan,

I tried this....

 <script>
                        var loaded=false;
                  </script>

             
             <iframe  id="ScrollerFrame" name="ScrollerFrame" allowtransparency="true" scrolling="no" marginheight="0" frameborder="0" align="middle" height="35px" width="100%" src="pages/Request_Form/testform.asp">
                  </iframe>
           
            <script>
                  var loaded=false;
                   if (document.onreadystatechange)
                  window.frames["ScrollerFrame"].document.onreadystatechange = function() {
                        if (readyState == 4 && !loaded) { loaded = true;  window.frames["ScrollerFrame"].location.reload(1) }    
                  }
                  </script>


still no joy :(
0
 

Author Comment

by:Pigdogmonster
ID: 19660540
Actually, I may be going about this the wrong way.  Let me breifly explain...

My main page is called: RequestForm.asp.
My Iframe if is pointing to 'Testform.asp'.

Testform.asp contains a TEXT field and a  SELECT.  The SELECT box draws in data from a database.

The problem is when the I run RequestForm.asp the Iframe is displayed but the Select box does not appear until the Iframe is refreshed.

Perhaps there is something I can put into the 'Testform.asp' file to make the SELECT box appear when the page is loaded?

Any ideas?
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19660541
sorry. try

   var loaded=false;
                   if (document.onreadystatechange)
                  window.frames["ScrollerFrame"].document.onreadystatechange = function() {
                        if (window.frames["ScrollerFrame"].document.readyState == 'complete' && !loaded) { loaded = true;  window.frames["ScrollerFrame"].location.reload(1) }    
                  }
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19660551
Ahh

perhaps you can show the html produced by a view-source in your browser of that iframe?
(I prefer looking at html to asp)
0
 

Author Comment

by:Pigdogmonster
ID: 19660568
Good idea!

Heres the source view of the IFRAME itself...


<form action="testform.asp" target="_self">
   <div id="rollbar">
        <div>
 <blockquote>
<table width="60%" border="0" cellspacing="1" cellpadding="1" align="center" class="style88">
<tr>
 <td><font size="1">Language:</td>
 <td>
<select name="Material_Group">
<option value="DE">German</option>
 <option value="EN">English</option>
 <option value="FI">Finnish</option>
<option value="FR">French</option>
<option value="HU">Hungarian</option>
</select></td>

<td align="right"><font size="1">Description:</td>
                  <td><label>
                    <input type="text" name="Sap_Description" id="Sap_Description" size="45" maxlength="40" />
                  </label></td>
                  <td><input type="submit" value="Add"/></td>
                </tr>
              </table>
 </form>


This is weird!  the Select box is showing in the HTML but not on the page????
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19660748
Do you have some script or css that might hide it?

To reload that frame is not the solution for sure.
Much better to fix the actual problem...

What is the mime type of the page

perhaps you load a page that is not rendered by IE - try loading your parent page into firefox and see if you get strange errors in the console
0
 

Author Comment

by:Pigdogmonster
ID: 19660847
hey :)

I have checked for css and J/script and there is none that would hide it, used the following to see if it would appear ..
style="display:block"   Nothing happens
style="background:#666666"  This shows the a rectangle block of colour.

I'm not sure what mime type my page is  -  is this something I would have to set in my page?

I'm going to speak to someone with firefx now and see what happens  - I'll you know :)

p.s.  thanks for helping me with this problem :)
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 19660857
Let's forget about mime type for now.
The server should set it
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

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…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
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…
Suggested Courses

850 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