create content dynamically with JS from external PHP file

Question

I'm trying to create a popup window with quite a bit of content, so I've put the content into a separate .php file and I use the following javascript to get the effect I want:

$('#popup').show();
var u = $("#username").html();
$('#popup').html('<iframe src="content.php?u='+u+'"></iframe>');

This works well, except that I have a close function for when the user hits the escape key:

$(document).keyup(function(e) {
  if (e.keyCode == 27) { 
    $('#popup').hide().html('');
    } 
});

My problem is that once the popup opens, and the user clicks within the iframe, the escape button no longer closes the window because I'm using the iframe.

Is there a better way in Javascript to include an external php file dynamically like this, or is there a way I can make the escape button function work even if the iframe has been clicked within?

From the same domain? use Ajax

mplungjan
– mplungjan

2014-05-11 20:11:43 +00:00
Commented May 11, 2014 at 20:11 — mplungjan
– mplungjan, Commented May 11, 2014 at 20:11
I didn't know I could use ajax that way. Thanks guys.

user2250471
– user2250471

2014-05-11 20:23:23 +00:00
Commented May 11, 2014 at 20:23 — user2250471
– user2250471, Commented May 11, 2014 at 20:23

Josh Beam · Accepted Answer · 2014-05-11 20:28:45Z

2

You can use jQuery's .load():

$('#popup').load('somefile.php');

answered May 11, 2014 at 20:28

Josh Beam

19.9k5 gold badges48 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Manoj Yadav · Accepted Answer · 2014-05-11 20:49:32Z

1

Its not advisable to use iframe, use ajax. If you still want to use iframe then you have to store the popup in top, e.g. add below code in main php file

top.popup = $('#popup');
top.popup.show();
var u = $("#username").html();
top.popup.html('<iframe src="content.php?u='+u+'"></iframe>');

And below code in main php and content.php

$(document).keyup(function(e) {
    if (e.keyCode == 27) {
        top.popup.hide().html('');
    }
});

answered May 11, 2014 at 20:49

Manoj Yadav

6,6121 gold badge25 silver badges21 bronze badges

Collectives™ on Stack Overflow

create content dynamically with JS from external PHP file

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related