0

UPDATED (with Link to example)

Link: https://brotherhoodgaming.net/ (click Nav menu > Settings > Profile Settings)

I am using an iFrame to load another page of my website onto my index page. It should all be from the same domain. When my iFrame page loads, it also loads a duplicate copy of the main Nav Menu. I would like to remove this iFrame nav menu and just have a pure frame filled with content.

My iFrame is created using a javascript append, when the user clicks a button.

$("#menuOverlay").append("<iframe id='iframeContact'' src='contact.php' width='300' height='100%' frameborder='0'></iframe>");

After that iframe is created my JS below should remove the nav menu inside the frame, but so far it hasn't worked. (UPDATED JS)

$("#iframeContact").contents().find("#nav").remove();

Any suggestions? I've been searching for this and the above JS was recommended, but I cannot get it to locate the elements inside the frame. Is this because my frame is created through JS append and the other functions don't have time to run?

enter image description here

enter image description here

dwashburn
  • 37
  • 1
  • 1
  • 8

1 Answers1

0

Try this instead. Removing a class does not remove the element itself. Just the class on the element. Assuming all your selectors are correct this should work.

It's working on the link but you need to make sure your iframe is fully loaded before executing the code.

var iframe = $("#iframeContact");
iframe.on("load",function ()
  {
    iframe.contents().find("#nav").remove();
  });
Isabel Inc
  • 1,871
  • 2
  • 21
  • 28
  • Thanks for the tip! I feel stupid for having the removeClass. That was foolish. I adjusted the JS though and it still isn't removing the element. Here is my updated JS: $("#iframeContact").contents().find("#nav").remove(); – dwashburn Aug 08 '16 at 16:17
  • Could you provide a link to the implementation. It could be a number of reasons if it's not removeclass. – Isabel Inc Aug 08 '16 at 16:18
  • Certainly. Updated the main question with link and instructions to replicate. – dwashburn Aug 08 '16 at 16:23
  • I've updated my code to include a wait for load. It should work now. – Isabel Inc Aug 08 '16 at 16:31
  • I hadn't thought of using a load. I tested the new code however and it still won't remove the element. Sorry for being a pain. I have also updated the production site to implement the new code you provided. I tested a few other methods as well (such as just searching for the parent div class ".navcontainer" instead of the child "#nav" to no avail) – dwashburn Aug 08 '16 at 16:41
  • If you execute the code `$("#iframeContact");.contents().find("#nav").remove();` in the web inspector console you will see that the element disapppears. So this code is correct. Just means its not executing at the right time. Can you console the contents of the iframe in the load and see what it returns. – Isabel Inc Aug 08 '16 at 16:44
  • Just in case it's a delegation issue try using the on method instead – Isabel Inc Aug 08 '16 at 16:54
  • When I run the code you mention in the console I actually get an Uncaught Syntax Error; unexpected token unfortunately. Also seems my question was downvoted by the same person.. – dwashburn Aug 08 '16 at 17:54
  • I cant see the error in the console . Did you change it? – Isabel Inc Aug 08 '16 at 17:57
  • I added an image to the main question showing the error. I copied and pasted but for some reason I still get the error. – dwashburn Aug 08 '16 at 18:00
  • I've posted it wrong. Remove the semicolon. `$("#iframeContact").contents().find("#nav").remove();` sorry about that – Isabel Inc Aug 08 '16 at 18:01
  • Ill mark your answer as correct since it now works in the console. The error must be somewhere else in the javascript load order. Ill try some different things. – dwashburn Aug 08 '16 at 18:08
  • I appreciate that. Check out this link I found about calling a function from within an iframe when it is loaded. It might help you out. Cheers and happy coding. http://stackoverflow.com/questions/5788499/jquery-iframe-load-event – Isabel Inc Aug 08 '16 at 18:13