1

What is wrong with this piece of code:

jQuery('<iframe id="groundplan_popup" class="groundplan_hidden" />').appendTo("#popup_holder");
var iframe = jQuery("#groundplan_popup");
iframe.attr("src","::censored::" + filename);
var iframe_body = iframe.contents().find('body').append('<div id="groundplan_popup_exit"></div>');
var exit_btn_gp = iframe_body.append(jQuery("#groundplan_popup_exit"));

So i have to dynamically create an iframe element which will open up .pdf file in a popup and that part works. What I can't manage to do is create a div with an id of "groundplan_popup_exit" within that iframe. I don't know exactly why this doesnt' work and what exactly I'm doing wrong. When i inspect the iframe window console brings out this warning:

/deep/ combinator is deprecated. See https://www.chromestatus.com/features/6750456638341120 for more details.

Dont know if it has anything to do with the reason why this isn't working.

EDIT:

This is what my code looks like now. enter image description here

Console prtscr: enter image description here

Iframe console elements prtscr:

enter image description here

So i'm basically confused about the whole situation as I'm not that experienced in using jquery in general and this is my first time using it with iframes. I'm not even sure if the #groundplan_popup_exit div is even created and how do I find it if it is.

5
  • 1
    You should append it once iframe is loaded
    – A. Wolff
    Feb 8, 2016 at 10:44
  • Could you create some demo to hack into? would help a lot to see the issue and fix it
    – Starx
    Feb 8, 2016 at 11:24
  • i edited the question so maybe now my problem is a little bit clearer Feb 8, 2016 at 11:37
  • Add div to the html of new iframe seems like a strange thing to me. IFrame has it's own content, why to add something to it? So why exactlu do you need this? Couldn't you just add the div to the page itself and position it after the iframe was loaded? Feb 8, 2016 at 12:34
  • I want to add a div which is absolutely positioned relative to the iframe window since it pops out in the center of the screen. I want it to be responsive so i cant position that div absolutely to anything else except for the iframe Feb 8, 2016 at 15:28

1 Answer 1

0

I see some problems:

var iframe_body = iframe.contents().find('body').append('<div id="groundplan_popup_exit"></div>');

Here you are already appending the element to the body.

var exit_btn_gp = iframe_body.append(jQuery("#groundplan_popup_exit"));

After you have appended above, you are trying to append again with jQuery("#groundplan_popup_exit") which does not even exists.

Fix (untested) would be something like this:

var iframe_body = iframe.contents().find('body');
var exit_btn_gp = iframe_body.append('<div id="groundplan_popup_exit"></div>');
2
  • I edited that part but it just can't be found in the iframe DOM Feb 8, 2016 at 11:17
  • @JesusChrist, What do you mean by it btw (just confused)?
    – Starx
    Feb 8, 2016 at 11:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.