Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Load iFrame content using a string in a URL

Posted on 2007-11-19
10
Medium Priority
?
2,716 Views
Last Modified: 2008-02-01
Hi Experts

I would like to know how to link to a webpage (Page A) from another page (Page B) and load that page (Page A) PLUS load specific content from Page C that is shown in an iFrame on Page A.

I'm thinking of using for example a URL string, eg something like...

www.url.com.au/default.asp?contentID=702&iframe=http://www.url.com

but I don't know how to pass the value for an iframe in a URL.

Does anyone out there know how to do this?
0
Comment
Question by:wesmanbigmig
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 4
10 Comments
 
LVL 11

Expert Comment

by:siliconbrit
ID: 20311494

I am not sure what you mean by "pass the value for an iframe in a URL".  Your syntax will already pass the value of your target iframe in the URL, assuming that www.url.com is your 'Page C'.

I think what you are asking is how to set the source of the iframe to be www.url.com.  You might do this by specifying the src (source) attribute of the iframe when you build the page:

   <iframe src="http://www.url.com" name="myframe" ></iframe>

Depending on the server-side language you are using, you would set this attribute using the variable 'iframe' available in the $_GET array.  Here is an example in PHP:

      <iframe src="<?php echo $_GET["iframe"]; ?> name="myframe" ></iframe>

Note that you don't have to include the 'http://' syntax since you could pre-specify this in your code.  Some malware scanners block the string 'http://' if it appears anywhere in a URL other than the beginning of the string.  So you could:

      <iframe src="http://<?php echo $_GET["iframe"]; ?> name="myframe" ></iframe>

    ...and your URL would be: www.url.com.au/default.asp?contentID=702&iframe=www.url.com

Once again, I am not sure if this is your question, so post back if this is not any help.  There are also other ways to achiee this, so it might be worthwhile expanding on your question.



   <iframe src="http://www.url.com" name="myframe" ></iframe>;

Open in new window

0
 

Author Comment

by:wesmanbigmig
ID: 20311512
Hi - thanks for your advice. However, I can't use PHP, as I'm on a Windows server, so any suggestions in Javascript or ASP would be great.

And yes you are correct in saying "I think what you are asking is how to set the source of the iframe to be www.url.com.  You might do this by specifying the src (source) attribute of the iframe when you build the page:"

...that is what I am trying to do. Set the contents of the iFrame that is contained in a page using a URL that is passed from another page.

Thanks
0
 
LVL 29

Expert Comment

by:QPR
ID: 20311554
ASP
<iframe src="<%request.querystring('iframe')%>"></iframe>
0
Moving data to the cloud? Find out if you’re ready

Before moving to the cloud, it is important to carefully define your db needs, plan for the migration & understand prod. environment. This wp explains how to define what you need from a cloud provider, plan for the migration & what putting a cloud solution into practice entails.

 
LVL 11

Expert Comment

by:siliconbrit
ID: 20311560


OK, assuming your URL is: www.url.com.au/default.asp?contentID=702&iframe=www.url.com

<iframe border=1 src="http://<% Response.Write(Request.QueryString("iframe")) %>" name="myframe" ></iframe>
0
 

Author Comment

by:wesmanbigmig
ID: 20316804
Hi siliconbrit and QPR. Thanks for your suggestions. These would work well if the CMS software I am using accepted ASP, but it doesn't seem to like it. So, the solution has to be in JavaScript.

So, can we do what you have done here, but in JavaScript instead of ASP:

ie...how to do the below in JavaScript...

OK, assuming your URL is: www.url.com.au/default.asp?contentID=702&iframe=www.url.com

<iframe border=1 src="http://<% Response.Write(Request.QueryString("iframe")) %>" name="myframe" ></iframe>
0
 
LVL 11

Expert Comment

by:siliconbrit
ID: 20316871

OK, well I guess the difficulty is going to be with your CMS, and what Javascript events can be fired legitimately, and what information is available from the URL.  Without knowing more about the CMS, I can only give you some basic help.

In javascript, you can dynamically set the source file of your iframe as long as the iframe has a name:

   <iframe name="myIframe"></iframe>

The code to set the iframe source can be:

   frames['myIframe'].location.href='http://www.url.com'

You could also use the Javascript DOM directly, although this may not work in all browsers:

   document.all.myIframe.src='www.url.com'

OK so how do you get the parameter from the URL in Javascript.  Well it's a little tricky, but there is a function below to help you:



Using the gup function, what you need to do in your javascript is something like:

   var targetURL = gup("iframe")

   document.all.myIframe.src=targetURL

Rather than give you finished code here, I've given you the tools you need to complete the work, given the contraints of your CMS system.

I hope this helps.
/* Credit: Original code from http://www.netlobo.com */
 
function gup( name ) {
   name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
   var regexS = "[\\?&]"+name+"=([^&#]*)";
   var regex = new RegExp( regexS );
   var results = regex.exec( window.location.href );
   if( results == null )
      return "";
   else
      return results[1];
}

Open in new window

0
 

Author Comment

by:wesmanbigmig
ID: 20316895
Thanks siliconbrit, so...

1) If I had an iframe on the page that was being called, and made sure this was called something like  <iframe name="myIframe"></iframe>, and
2) I included the gup function/script on the page being called, and
3) used var targetURL = gup("iframe") and frames['myIframe'].location.href=targetURL

would that work do you think? My javascript isn't very good, so any extra help would be greatly appreciated and I would be happy to award the full 500 points to you - I just want to get this working. Thanks again!
0
 
LVL 11

Accepted Solution

by:
siliconbrit earned 2000 total points
ID: 20316937
Well, this may be blocked by your CMS, but if I were doing it *outside* of a CMS, this is what I would do.

The example I have given is a full, working HTML page that answers your question completely.  I can't help you put this into your CMS as I have no idea what CMS you are using, or what it's restrictions are.

I have answered this question correctly and completely in ASP and Javascript now - hope this helps.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
 
<!-- Javascript for inside the <head> section of your page -->
<script type="text/javascript">
function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}
 
/* Credit: Original code from http://www.netlobo.com */
 
function gup( name ) {
   name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
   var regexS = "[\\?&]"+name+"=([^&#]*)";
   var regex = new RegExp( regexS );
   var results = regex.exec( window.location.href );
   if( results == null )
      return "";
   else
      return results[1];
}
 
 
addLoadEvent(function() {
       var targetURL = gup("iframe");
      document.all.myIframe.src=targetURL;
})
</script>
</head>
 
 
 
 
<body>
 
<!-- Code for inside your page <body> tag -->
 
<iframe name="myIframe" width="400" height="400">Javascript didn't work properly</iframe>
 
</body>
</html>

Open in new window

0
 

Author Comment

by:wesmanbigmig
ID: 20316947
Superb, this looks like it will work a treat - thanks siliconbrit! I'll give it a go and then award thr 500 points to you. Many thanks!
0
 

Author Comment

by:wesmanbigmig
ID: 20323717
Hi Siliconbrit - your solution worked a charm! Thank you!
0

Featured Post

Plesk WordPress Toolkit

Plesk's WordPress Toolkit allows server administrators, resellers and customers to manage their WordPress instances, enabling a variety of development workflows for WordPress admins of all skill levels, from beginners to pros.

See why 2/3 of Plesk servers use it.

Question has a verified solution.

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

Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

715 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