SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Member KPinAF's Avatar
    Join Date
    Feb 2005
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Changing the src of one iFrame from Another

    Hello,

    I have a page which contains two iFrames (I will call them Big and Little for easy reference). Basically when a link in Big is clicked, I am trying to change the src or little. I have done a few searches and came up with this:

    parent.frames['Little'].src = "link"

    However, when the link is clicked I get the 'object is null or not an object' error. HELP! Thanks for all the help.

  2. #2
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this:

    parent.frames['Little'].location.href="somepage.htm"

    iframes have sort of a dual nature. First, they are a window, and can be referred to just like other frame windows:

    window.frame["iframeName"]

    ...and any window has a location.href property that can be used to load a new page in the window. But, <iframe>'s are also an html element with a src attribute:

    <iframe id="my_iframe" src="page1.htm"></iframe>

    ...and you can change an html element's attributes like this::

    parent.document.getElementById("my_iframe").src = "somepage.htm"

    The first method has wider support across browsers.

  3. #3
    SitePoint Member KPinAF's Avatar
    Join Date
    Feb 2005
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I am still receiving the error stated above. I tried both approaches and neither seem to work. Now the link that changes one iframe is not on the main page, it is in another iframe located on the same page. Is it possible to do this?

  4. #4
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Now the link that changes one iframe is not on the main page, it is in another iframe located on the same page. Is it possible to do this?
    Very easily using this:

    parent.frames['Little'].location.href="somepage.htm"

    Post both iframe html tags and the link tag as well as any function called by the link. Also post the line in your js that is causing the error.

  5. #5
    SitePoint Member KPinAF's Avatar
    Join Date
    Feb 2005
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, first the iframes....

    Big:
    HTML Code:
    <iframe name="Big" ID="Big" width="100%" height="100%" border="0" frameborder="0" src="usr_list.asp" marginwidth="1" marginheight="1">
    Little:
    HTML Code:
    <iframe name="Little" ID="Little" height="100%" width="100%" border="0" frameborder="0" src="all_info.asp" marginwidth="1" marginheight="1">
    And here's the link that calls the function:
    HTML Code:
    <a href="#" onclick="loadconfirm()">[Delete This User]</a>
    And lastly the very simple function:
    Code:
    function loadconfirm() {
    	parent.frames['Little'].location.href="usr_delconfirm.asp"
    }
    Thanks again for the help.

  6. #6
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    There are a couple of things wrong, but neither of them produces the error. What browser are you using?

    1) If the link is in Little, the function should change Big. You have it changing Little.

    2) You don't have closing tags for your iframes: </iframe>

  7. #7
    SitePoint Member KPinAF's Avatar
    Join Date
    Feb 2005
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well the two things I listed are just oversights on my part...the closing tags for the iframe's are there, I just assumed you wanted to see the paramets I defined them with, thats why I didn't paste them in. Also, how I have it in the code is correct, I just stated it wrong.

    Let me review my code again. If you say the code you provided should work, then my problem must lie elsewhere. Thanks again for all your help.

    EDIT: oh and I am using IE6 if that brings up any flags.

  8. #8
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is my code if you want to try it--it works.

    main.htm:
    Code:
    <html>
    <head><title></title>
    </head>
    <body >
    
    <iframe name="Big" ID="Big" width="100%" height="100%" border="0" frameborder="0" src="big1.htm" marginwidth="1" marginheight="1"></iframe>
    
    <iframe name="Little" ID="Little" height="100%" width="100%" border="0" frameborder="0" src="little.htm" marginwidth="1" marginheight="1"></iframe>
    
    </body>
    </html>
    big1.htm:
    Code:
    <html>
    <head><title></title>
    </head>
    <body>
    
    <div>page1 in Big</div>
    
    </body>
    </html>
    big2.htm:
    Code:
    <html>
    <head><title></title>
    </head>
    <body>
    
    <div>page2 in Big</div>
    
    </body>
    </html>
    little.htm:
    Code:
    <html>
    <head>
    <title></title>
    <script>
    
    function loadconfirm() {
    	parent.frames['Big'].location.href="big2.htm";
    }
    
    </script>
    </head>
    <body>
    
    <div>page in Little</div>
    <a href="#" onclick="loadconfirm()">[Delete This User]</a>
    
    </body>
    </html>

  9. #9
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What page is your function on?

  10. #10
    SitePoint Member KPinAF's Avatar
    Join Date
    Feb 2005
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok I made new pages as a test exactly like you have them. It works great. However, when I incorporate the code exactly like you have it into my pages it does not work. Now what I have found that I should have mentioned earlier is that the main page is an html application. As soon as I strip the .hta extension and put .html it works fine. Does an html application not support Javascript?


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
  •