Solved

How can I dynamically display an external page in an iframe?

Posted on 2010-09-24
7
266 Views
Last Modified: 2012-05-10
I'd like to have a single page at my site where I could dynamically display an iframe of an external URL with my branding above it, so that a URL like http://www.mysite.com/view.php?URL=www.cnn.com would automatically display in this layout:

http://cl.ly/6b7e8801e41034045e22

the way StumbleUpon's top banner looks (doesn't have to be that url structure)

Is there a way to do this in PHP or jQuery?

Thanks,

Nathan
0
Comment
Question by:nbierm65
  • 3
  • 2
  • 2
7 Comments
 
LVL 40

Expert Comment

by:gurvinder372
ID: 33753425
if the iframe's id attribute value is 'iframeId' then

$("#iframeId").attr("src", "http://www.mysite.com/view.php?URL=www.cnn.com");

you can put this line whenever you want to update the iframe's content
0
 
LVL 7

Expert Comment

by:ziceva
ID: 33753454
Why would you need it to be "dynamic"?

You can simply have view.php look like this:
<html>
<head>
<title>Whatever</title>
</head>
<body>
<div>
##Your Branding HERE##
</div>
<iframe id="the_iframe" src=<?php echo $_GET["URL"]; ?>></iframe>
</body>
</html>

Of course, you need a little CSS & stuff...

By "dynamic" one would understand that AFTER what I the code I just gave is loded, you what to change the content of only the iframe which would require a little javascript "magic" like this:

in the branding <div> you would have a button:

<input type="button" value="Other URL" onclick="document.getElementById('the_iframe').src='http://www.google.ro'">

That [i]dynamically[/i] loads www.google.ro in the iframe when pressed.
0
 

Author Comment

by:nbierm65
ID: 33753500
Maybe 'dynamic' is the wrong word. What I mean is that I would type

http://www.mysite.com/view.php?URL=www.cnn.com

and see cnn.com in the iframe, and then type  

http://www.mysite.com/view.php?URL=www.espn.com

and see espn.com in the iframe, without any adjustments to any code--ideally without even any need to click an input button in a branding div. So in essence, how to get this

<?php echo $_GET["URL"]; ?>

to pull the external URL right from here:

http://www.mysite.com/view.php?URL=www.espn.com

without any other steps. Does that make sense?
0
Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

 
LVL 7

Accepted Solution

by:
ziceva earned 500 total points
ID: 33753562
for this to work: <iframe id="the_iframe" src="<?php echo $_GET["URL"]; ?>"></iframe>

The URL has to begin with http://
You can tweak it a little bit, and will work either way:

<iframe id="the_iframe" src="<?php echo  substr($_GET["URL"],0,7)=="http://"?$_GET["URL"]:"http://".$_GET[URL]; ?>"></iframe>

This works if you access:
http://www.mysite.com/view.php?URL=www.espn.com
or
http://www.mysite.com/view.php?URL=http://www.espn.com
0
 

Author Closing Comment

by:nbierm65
ID: 33753623
got it, thanks!

http://nathanbweb.host22.com/try/iframe/extiframephp.html?URL=http://www.cnn.com

my question got posted twice by mistake, and in the other thread someone gave me a JS solution, if anyone's curious or would prefer that:

http://bit.ly/bhApLl
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 33753666
@nbierm65: Did the jquery solution not worked?
0
 

Author Comment

by:nbierm65
ID: 33753790
I wasn't sure how to try it, since it seemed to be creating an iframe within which the entire URL string was called as the source. Also, it seemed that each URL would have to be hardcoded into the jQuery. (Maybe I misunderstood what you proposed.) I was looking for the iframe to call only the external URL after parsing it from the URL string (if that makes sense; I may have my terms jumbled). If you have a way to do that, so that a page like is automatically produced in jquery (and the cnn.com can be changed to any URL just by typing it into the browser bar):
http://nathanbweb.host22.com/try/iframe/extiframe.html?URL=http://www.cnn.com

I'll see if there's a way to go back and award multiple points, or re-post it as a jQuery-only question and award your solution.
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
add a 3rd selection to sum 7 29
mysqli insert query problems 4 22
Number of hours between date in DB and now 8 18
how to use a switch statement with heredoc 11 23
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
3 proven steps to speed up Magento powered sites. The article focus is on optimizing time to first byte (TTFB), full page caching and configuring server for optimal performance.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question