Appending div to iframe
Jesus Christ’s Question:
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.
Console prtscr:
Iframe console elements prtscr:
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.
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>');
