0

I am wondering where to start since I know almost nothing when it comes to JavaScript how to use it to calls an Iframe that was built using HTML5. heres the line of code I am using that i want to try to allow to call into the Iframe without having to reload the entire page.

<BR><a style="text-decoration:none" href="test.html" target="_top">test</a>

thats the code I'm trying to place into this iframe without having the whole page reload or load a new tab which is the problem i keep running into...

<div id="contentframe">
  <iframe seamless id="contentframe" src="Contentframe.html" height=550px width=1003px align=center frameborder= "0"></iframe>
  </div>

Honestly any help would be amazing at this point

j08691
  • 204,283
  • 31
  • 260
  • 272
AlphaGambit
  • 1
  • 1

2 Answers2

0

You can reach the parent from the iFrame by calling parent.document. There are some other stackoverflow issues about your question (if I understood your question well):

Calling javascript function in iframe

Reading parent document from iFrame and changing parent

I hope I helped you.

Community
  • 1
  • 1
Attila Komlosi
  • 9
  • 2
  • Awesome thank you this is actually very helpful having the links in there i have searched and couldn't find them lol. I guess I was searching in the wrong strings – AlphaGambit Oct 18 '15 at 20:32
  • Maybe this can help you more: http://stackoverflow.com/questions/2161388/calling-a-parent-window-function-from-an-iframe That means you can reach only the iframe "window.parent" and you can call the functions on it. https://developer.mozilla.org/en-US/docs/Web/API/Window/parent What do you want to do with that link? What should happen if I click on it? – Attila Komlosi Oct 18 '15 at 20:33
  • well the main issue im having is that im trying to call a link into the iframe and am having the issue of another tab opening and it not actually loading into the iframe itself and it seems that the only solution is JS and well i have no knowledge of JS aside from it being nothing but scripts (correct me if im wrong). so really im now realizing that im searching for an example that can work with my current code that implements JS into the link calling it into the actual iframe...although the links that were given are very helpful – AlphaGambit Oct 18 '15 at 20:39
  • ok well the link itself should pop up an informational inside the iframe that also within itself has sublinks that send you to another tab to input said information that has been requested to make it easier for the server to find the users information for use if that helps you any – AlphaGambit Oct 18 '15 at 21:01
0

This is basic Vanilla JS function that grabs the event of "click" from a button and them populates the chosen div with content. This is how I would approach your problem. Hope this is helpful!

Check out this JS Fiddle

HTML

<button id="frameAdd">Add I-Frame</button>
<div id="contentFrame"></div>

JS

var button = document.getElementById( "frameAdd" )
var frame = document.getElementById( "contentFrame" )


button.addEventListener( "click", function () {
    frame.innerHTML = '<iframe width="560" height="315" src="https://www.youtube.com/embed/91liSjahuNw" frameborder="0" allowfullscreen></iframe>'
})
ALFmachine
  • 639
  • 7
  • 12
  • I have tried the first example with HTML and for some reason even though my code is running xHTML it seems to bring it as a hack more then anything and discards it like it was never there to begin with. but i will try the JS and see where i get and let you know....thank you for the help =) – AlphaGambit Oct 18 '15 at 20:43
  • ok JS didnt work but at the same time it did the only problem it gave me was that it created another iframe atop the inital page that i have laid out. Maybe im missing something here maybe i need to implement in the <"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> for it to have JS in there somewhere – AlphaGambit Oct 18 '15 at 20:51
  • can you pot a link to fiidle or pen so i can see your code? – ALFmachine Oct 18 '15 at 21:20