Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    pml
    pml is offline
    New Coder
    Join Date
    Mar 2005
    Posts
    31
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Why does this frameset not run the script onload?

    I have this code. It consists of one frameset called "frameset.htm" and to frames called "left" src=left.htm and "right" src=right.htm.

    In the left frame I have a form with a hidden element (value=10) and some radio buttons with numbers attached to each one of them.

    In the right frame I basically just have a <div> whose content depends on which radio buttons are selected in the form. The <div> should display the sum of the radio buttons. When changes are made in the form (another radio button is clicked) the index and the new value are sent to change the value of that array index. To calculate the sum of all the radiobuttons I use an array called MyArray, which is looped to sum everything up.

    My problem is that the first time I open the frameset, nothing is displayed in the right frame. The very second I change the default values in the form, the code works exactly the way I want. If I then browse back to the frameset it's the same thing again. Nothing is displayed in the right frame until I make changes to the form. By default "The sum is: 10" should be displayed (hidden default_value is 10) since I use a <body onload> function in the right frame to call the calculate2() function in the left frame.

    Hope you can find the source of my problem..


    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
    <html>
    <head></head>
    
    <frameset cols="*,250" frameborder="yes" border="1">
      <frame src="left.htm" name="left">
      <frame src="right.htm" name="right">
    </frameset><noframes></noframes>
    <body>
    
    </body>
    </html>

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <script language="javascript" type="text/javascript">
    var MyArray = new Array();
    
    function Calculate (index, value) {
    MyArray[index] = value;
    Calculate2();
    }
    
    function Calculate2() {
    var Total = parseInt(document.Form1.default_value.value);
       for(var i=0; i<MyArray.length; i++){
         Total += MyArray[i];
         }
    window.parent.right.document.getElementById('sum').innerHTML="The sum is: "+Total+" units"; 
    }
    
    </Script>
    </head>
    
    <body>
    
    <form name="Form1">
    	<input type="hidden" value="10" name="default_value">
    <script language="JavaScript">
    	MyArray[0] = 0;
    </script>
    	<input name="group1" type="radio" value="some_value1"  checked onClick="Calculate(0, 0)"> <br>
    	<input name="group1" type="radio" value="some_value2"  onClick="Calculate(0, 3)"> Add 3 <br> 
    	<input name="group1" type="radio" value="some_value3"  onClick="Calculate(0, 5)"> Add 5 <br>
    	<p></p>
    <script language="JavaScript">
    	MyArray[1] = 0;
    </script>
        <input name="group2" type="radio" value="some_value4"  checked onClick="Calculate(1, 0)"> <br>
    	<input name="group2" type="radio" value="some_value5"  onClick="Calculate(1, 10)"> Add 10 <br> 
    	<input name="group2" type="radio" value="some_value6"  onClick="Calculate(1, 15)"> Add 15 <br>
     <p></p>
    <script language="JavaScript">
    	MyArray[2] = 0;
    </script>
        <input name="group3" type="radio" value="some_value7"  checked onClick="Calculate(2, 0)"> <br>
    	<input name="group3" type="radio" value="some_value8"  onClick="Calculate(2, 7)"> Add 7 <br> 
    	<input name="group3" type="radio" value="some_value9"  onClick="Calculate(2, 18)"> Add 18 <br>
    </form>
    
    </body>
    </html>
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <script language="javascript" type="text/javascript">
    
    function init() {
    	window.parent.left.document.Calculate2();
    	}
    
    </Script>
    </head>
    
    <body onload="init()">
    
    <div id="sum"></div>
    
    </body>
    </html>

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    left frame:
    Code:
    <head>
    <script type="text/javascript">
    var timer;
    function Calculate2() {
       var rightFrame = window.parent.frames["right"];
       if (rightFrame.loaded){
         clearInterval(timer);
         var Total = parseInt(document.Form1.default_value.value);
         for(var i=0; i<MyArray.length; i++){
           Total += MyArray[i];
         }
         rightFrame.document.getElementById('sum').innerHTML="The sum is: "+Total+" units";
       }
    }
    window.onload = function(){
      timer=setTimeout('Calculate2()', 50);
    }
    </script>
    </head>
    right frame:
    Code:
    <head>
    <script type="text/javascript">
    var loaded = false;
    window.onload = function(){
      loaded = true;
    }
    </script>
    </head>
    </head>
    <body>
    <div id="sum"></div>
    </body>
    </html>
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    pml
    pml is offline
    New Coder
    Join Date
    Mar 2005
    Posts
    31
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Thanks a lot!

    Thanks Glenngv!

    The help you provided solved the problems I had.

    However, it would be very nice to understand what everything in the code really does. The code that I'am not sure of is:

    if (rightFrame.loaded){
    clearInterval(timer);

    window.onload = function(){
    timer=setTimeout('Calculate2()', 50);

    window.onload = function(){
    loaded = true;
    }

    Hope you (or some other kind person) can take a few seconds to explain them too. I understand that it has something to do with timings and calling functions but not much more.

    Thanks again

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Glad to help.
    But there was error on my part. It should have been setInterval instead of setTimeout.

    You're right. It's all about timing. What the left frame does is continuously polling the right frame to check if the page in it has completely loaded. There is a flag, which is a global variable, in the right frame that gets set to true when the page has completely loaded. This flag is checked by the left frame and if it's set to true, the left frame updates the right frame and clears the timer so that left frame stops polling the right frame.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •