SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    iframe button that adds a value to parent variable

    Hello,

    I am trying to write a script that allows a button in an iframe to change the value of a variable that is in the parent page. I then want to have an if statement in the parent that will change the url of the iframe ( or even change the url of the parent)

    Here's what I have for the parent:

    HTML Code:
    <html>
    <head>
    <iframe src="http://zaazoo.thewebbusters.com/button.html">
    </iframe>
    </head>
    <body>
    <script type="text/javascript">
    var a=0
    function addToA () {
    	a=(a+1)
    }
    if(a==1) {
    	window.location="http://www.google.com"
    }
    }
    </script>
    </body>
    </html>
    here's what I have for the iframe

    HTML Code:
    <html>
    <head>
    </head>
    <body>
    <div style=" position: absolute; left:80; top: 35;">
    <input type="button" onclick="parent.addToa()" value="Next">
    </div>
    </body>
    <html>
    I figured this script should change the parent to the url, but it doesn't. Does anyone know what event I could use to change the iframe url? the parent url?

    Thanks again for all your help,
    Dave
    Last edited by Mittineague; Aug 14, 2011 at 11:38. Reason: reformatting bbcode tags

  2. #2
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by daveryaaziem View Post
    Code:
    <input type="button" onclick="parent.addToa()" value="Next">
    I'm sure this would work if only you'd call the same function that you wrote.

    Also use the error console and you won't find yourself here so often.
    Tab-indentation is a crime against humanity.

  3. #3
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Thanks Logic Ali,

    I do realize that i wrote parent.addToa() instead of parent.addToA(), but neither of them get me any results.

    Dave

  4. #4
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by daveryaaziem View Post
    Hey Thanks Logic Ali,

    I do realize that i wrote parent.addToa() instead of parent.addToA(), but neither of them get me any results.

    Dave
    One more time: Use the error console.
    Tab-indentation is a crime against humanity.

  5. #5
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't know what/where the error code console is

  6. #6
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,269
    Mentioned
    196 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by daveryaaziem View Post
    I don't know what/where the error code console is
    What browser(s) are you using?

  7. #7
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I use IE9, firefox5, and Chrome 13.0.782.112

  8. #8
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by daveryaaziem View Post
    I don't know what/where the error code console is
    LMGTFY
    Tab-indentation is a crime against humanity.

  9. #9
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Logic Ali,

    such a fine character you are

  10. #10
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,269
    Mentioned
    196 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by daveryaaziem View Post
    I use IE9, firefox5, and Chrome 13.0.782.112
    Well, I don't have any of those browsers so I can't say for certain. But I do have an older Firefox.

    If the menu bar has "Tools" there should be an "Error Console" under that.

    If so, open that, go to the page, then look in the console for Errors.

  11. #11
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you Mittineague.

    As I am new to javascript, I do not find the error console to be of much use. Plus the errors it is giving me is that the Parent.addToA() is not a function as it refers to the iframe. I think I can understand why because that function is scripted on the parent not the child. Anyway sorry for rambling. Do you have any suggestions to why the script may not be working?

  12. #12
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,269
    Mentioned
    196 Post(s)
    Tagged
    2 Thread(s)
    Unless the error console has changed, I think it's very helpful (once you understand what it's saying) eg. I get
    Code:
    Error: syntax error
    Source File: file:///C:/My%20Documents/TEST/davery.html
    Line: 14
    Source Code:
    }
    and after the click
    Code:
    Error: parent.addToa is not a function
    Source File: file:///C:/My%20Documents/TEST/davery-button.html
    Line: 1
    The first error message points to an extra curly brace, the second suggests a sytax error

    After removing the extra curly brace and changing the onclick to
    HTML Code:
    <input type="button" onclick="addToa()" value="Next">
    the error console shows
    Code:
    Error: addToa is not defined
    Source File: file:///C:/My%20Documents/TEST/davery-button.html
    Line: 1
    this suggests a problem with the function.
    So I renamed addToa to addToA (they gotta be the same!)

    To simplify debugging, I put everything in one file - BUT
    I would take the iframe out of the <head> and put it into the <body> where <iframe>s belong. And I put the <script> in the <head>

    This page gives no errors.
    HTML Code:
    <html>
    <head>
    <script type="text/javascript">
    var a=0
    function addToA () {
    	a=(a+1)
    if(a==1) {
    	window.location="http://www.google.com"
    }
    }
    </script>
    </head>
    <body>
    <div style=" position: absolute; left:80; top: 35;">
    <input type="button" onclick="addToA()" value="Next">
    </div>
    </body>
    </html>

  13. #13
    SitePoint Member
    Join Date
    Aug 2011
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much for your help! It works perfectly


Tags for this Thread

Bookmarks

Posting Permissions

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