Opening link with iframe target on different page

Trakaa · August 1, 2009

This is sort of difficult to put into words what I am trying to do though I will give it a shot.

I have a CMS and that cms loads pages like this: www.example.tld/index.php?name=Whatever

I have a page on the site that is a user list. The page url looks like the one above simply with Members instead of Whatever.

On that page is an iframe that when you click on the corresponding link targets the iframe on the page and opens up that persons info. What I would like to do is be able to link to that persons info from a module or site elsewhere other than that page and have it load up the info just the same as if they had went to the list and clicked it.

The user info that is loaded in the iframe is a simple html file. The index.php file looks like this:

<?php

// protect against direct access
if (!defined('CPG_NUKE')) { exit; }

// initiate the page title
$pagetitle .= '';

// include the header in the page generation
require_once('header.php');

// start a new table in which we will show some text
OpenTable();
// show the text on the page
echo '
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style type="text/css">

body {
	font-family: Palatino Linotype;
}

#nav, #nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	float : left;
	width : 11em;
}

#nav li { /* all list items */
	position : relative;
	float : left;
	line-height : 1.25em;
	margin-bottom : 0px;
	width: 11em;
}

#nav li ul { /* second-level lists */
	position : absolute;
	left: -999em;
	margin-left : 12em; /*Outset of sub menu box (Should match nav li a w\idth vaule PLUS 1 so if this value is 9 w\idth will be  */
	margin-top : -1.25em;
}

#nav li ul ul { /* third-and-above-level lists */
	left: -999em;
}

#nav li a {
	width: 9em;
	w\idth : 11em; /*Link box width*/
	display : block;
	color : black;
	font-weight : bold;
	text-decoration : none;
	background-color : #454545;
	border : 0px solid black;
	padding : 0 0.5em;
}

#nav li a:hover {
	color : black;
	background-color : #747474;
	border : 0px solid black;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

#content {
	margin-left : 12em;
}
</style>


<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
	sfEls[i].onmouseover=function() {
		this.className+=" sfhover";
	}
	sfEls[i].onmouseout=function() {
		this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
	}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>

</head>
<center><h1>Alumni</h1></center>
<table align="center" valign="top">
<tr>

<td valign="top" style="padding-top : 9px">
<ul id="nav">

<li><a href="#">Founding Class</a>
	<ul>	
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/RoyDaniels.html" target="form">1 Roy Daniels</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/ElijahKlay.html" target="form">2 Elijah Klay</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/ValerieTait.html" target="form">3 Valerie Tait</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/AndrewMcEwen.html" target="form">4 Andrew McEwen</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/DavidLong.html" target="form">5 David Long</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/SteveLiparulo.html" target="form">6 Steve Liparulo</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/SheilaMoghadam.html" target="form">7 Sheila Moghadam</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/CamiloCortes.html" target="form">9 Camilo Cortes</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/DarenGoldin.html" target="form">11 Daren Goldin</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/MatthewCrosby.html" target="form">12 Matthew Crosby</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/ScottEvarts.html" target="form">13 Scott Evarts</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Founding/DerekKunkle.html" target="form">14 Derek Kunkle</a></li>
        </ul>   
    </li>

    <li><a href="#">Alpha Class</a>
    <ul>
		<li><a href="http://usfthetatau.org/modules/Alumni/Alpha/TysonHuntsman.html" target="form">15 Tyson Huntsman</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Alpha/StephenAskew.html" target="form">16 Stephen Askew</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Alpha/KevinHolmes.html" target="form">20 Kevin Holmes</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Alpha/ElizabethJones.html" target="form">22 Elizabeth Jones</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Alpha/AndrewOrtoski.html" target="form">23 Andrew Ortoski</a></li>
    </ul>
    </li>

    <li><a href="#">Beta Class</a>
    <ul>
		<li><a href="http://usfthetatau.org/modules/Alumni/Beta/MoeKhawaja.html" target="form">26 Moe Khawaja</a></li>
    </ul>
    </li>

    <li><a href="#">Gamma Class</a>
    <ul>
		<li><a href="http://usfthetatau.org/modules/Alumni/Gamma/PatrickTynan.html" target="form">33 Patrick Tynan</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Gamma/JonathanTodd.html" target="form">35 Jonathan Todd</a></li>
		<li><a href="http://usfthetatau.org/modules/Alumni/Gamma/JoeJohnson.html" target="form">36 Joe Johnson</a></li>
    </ul>
    </li>

</ul>

</td>

<td width="200" valign="top">
</td>

<td valign="top" style="padding-left : 20px">
<iframe src="http://usfthetatau.org/modules/Alumni/fuckIE.html" name="form" height="2000" width="440" scrolling="auto" frameborder="no" allowtransparency="true"></td>
</tr>
</table>
</body>
</html>
';

// close the table that we have created
CloseTable();

// there isn't any need to include the footer, as the index page handles this already
// require('footer.php');

To reiterate lets say I was on the home page and wanted to see Roy Daniels. I would click the RoyDaniels link and it would open index.php?name=Alumni and load in Roy Daniels info.

I hope I have explained this good enough and I that you all for your help.

bundyxc · August 1, 2009

Maybe I'm missing something.. could you explain what you need help doing?

Trakaa · August 1, 2009

Ill try

I have a members list at usfthetatau.org/index.php?name=Alumni

That page(the code I link above)as you can see has an iframe. That iframe loads an html file with user info and a picture. In other words there is a menu with links that all target that iframe. This all works great on the alumni page BUT I want to be able to link to the alumni page from a separate page AND have a certain person load into the iframe.

Example: I am on my homepage and there is a link for someone say Bob. When a user clicks that link the Alumni page opens and the iframe automatically loads Bob's info in the iframe.

gevans · August 1, 2009

You need to check the request data being sent to the page, and adjust the URL in the iframe src accordingly.

Trakaa · August 1, 2009

Now you have lost me. The url src is set to a default value why would I change that? The thing I want to change is the link coming from the main page of my site so that when I click a certain persons name they open up in my second page instead of the default.

gevans · August 1, 2009

When you access the page from a different page, you add some GET data to the URL rather than accessing the user via an internal link.

Use that get data to change the src of the iframe

ldougherty · August 1, 2009

Your individual member profiles are module based out of a completely different directory.

for example..

http://usfthetatau.org/modules/Alumni/Alpha/AndrewOrtoski.htm

These modules load inside of the iframe as this is where they are clicked on and the iframe itself has a specific target for them.

If you can show us the source for the iframe page of alumni so we can see how exactly it loads and calls the particular members we'd be able to give you a better idea of how to call the alumni page and specify a certain user.

Trakaa · August 2, 2009

I thought that was what I linked above. That php page does everything. Or were you looking for the individual html pages for each member?

_DarkLink_ · August 2, 2009

Hello there,

anyway, this is my first time trying to help someone, so I'll try as best as I can.

If I get you correctly, you are wanting the iframe source to change dependently to the url that is in the address bar.

So you would need to first make an "if" statement or a "switch" case every possible cases.

We will be using both.

//Put this anywhere before your "echo" and don't forget to remove the php tags
<?php
if ($_GET['name']) {//if the url has "?name" after the file.

$name = $_GET['name'];//if yes then "$name" = value of "?name"
switch ($_GET['class']){//switch = if

case 'founding':
$class = 'founding';
break;
case 'alpha':
$class = 'alpha';
break;
case 'Beta':
$class = 'Beta';
break;
case 'Gamma':
$class = 'Gamma';
break;

}//end switch
}//end if
?>

Then after making those conditional statements, we need to apply them to your iframe source.

<iframe src="<?php echo"http://usfthetatau.org/modules/Alumni/".$class."/".$name.".html";?>" name="form" height="2000" width="440" scrolling="auto" frameborder="no" allowtransparency="true">

Finally, after doing everything, you just need to change the links to the member profiles on the page accordingly:

http://usfthetatau.org/modules/Alumni/Alpha/TysonHuntsman.html

to

http://usfthetatau.org/index.php?name=TysonHuntsman&class=Alpha

So all in one, the code should be like so, don't forget to change the links on it, I'm not changing them for you. =P

<?php

// protect against direct access
if (!defined('CPG_NUKE')) { exit; }

// initiate the page title
$pagetitle .= '';

if ($_GET['name']) {//if the url has "?name" after the file.

$name = $_GET['name'];//if yes then "$name" = value of "?name"
switch ($_GET['class']){//switch = if

case 'founding':
$class = 'founding';
break;
case 'alpha':
$class = 'alpha';
break;
case 'Beta':
$class = 'Beta';
break;
case 'Gamma':
$class = 'Gamma';
break;

}//end switch
}//end if

// include the header in the page generation
require_once('header.php');

// start a new table in which we will show some text
OpenTable();
// show the text on the page
echo '
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
   <style type="text/css">

   body {
      font-family: Palatino Linotype;
   }

   #nav, #nav ul { /* all lists */
      padding: 0;
      margin: 0;
      list-style: none;
      float : left;
      width : 11em;
   }
   
   #nav li { /* all list items */
      position : relative;
      float : left;
      line-height : 1.25em;
      margin-bottom : 0px;
      width: 11em;
   }
   
   #nav li ul { /* second-level lists */
      position : absolute;
      left: -999em;
      margin-left : 12em; /*Outset of sub menu box (Should match nav li a w\idth vaule PLUS 1 so if this value is 9 w\idth will be  */
      margin-top : -1.25em;
   }
   
   #nav li ul ul { /* third-and-above-level lists */
      left: -999em;
   }
   
   #nav li a {
      width: 9em;
      w\idth : 11em; /*Link box width*/
      display : block;
      color : black;
      font-weight : bold;
      text-decoration : none;
      background-color : #454545;
      border : 0px solid black;
      padding : 0 0.5em;
   }
   
   #nav li a:hover {
      color : black;
      background-color : #747474;
      border : 0px solid black;
   }
   
   #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
      left: -999em;
   }
   
   #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
      left: auto;
   }
   
   #content {
      margin-left : 12em;
   }
</style>


<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
   var sfEls = document.getElementById("nav").getElementsByTagName("LI");
   for (var i=0; i<sfEls.length; i++) {
      sfEls[i].onmouseover=function() {
         this.className+=" sfhover";
      }
      sfEls[i].onmouseout=function() {
         this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
      }
   }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>

</head>
<center><h1>Alumni</h1></center>
<table align="center" valign="top">
<tr>

<td valign="top" style="padding-top : 9px">
<ul id="nav">

   <li><a href="#">Founding Class</a>
      <ul>   
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/RoyDaniels.html" target="form">1 Roy Daniels</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/ElijahKlay.html" target="form">2 Elijah Klay</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/ValerieTait.html" target="form">3 Valerie Tait</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/AndrewMcEwen.html" target="form">4 Andrew McEwen</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/DavidLong.html" target="form">5 David Long</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/SteveLiparulo.html" target="form">6 Steve Liparulo</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/SheilaMoghadam.html" target="form">7 Sheila Moghadam</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/CamiloCortes.html" target="form">9 Camilo Cortes</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/DarenGoldin.html" target="form">11 Daren Goldin</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/MatthewCrosby.html" target="form">12 Matthew Crosby</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/ScottEvarts.html" target="form">13 Scott Evarts</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Founding/DerekKunkle.html" target="form">14 Derek Kunkle</a></li>
        </ul>   
    </li>

    <li><a href="#">Alpha Class</a>
       <ul>
         <li><a href="http://usfthetatau.org/modules/Alumni/Alpha/TysonHuntsman.html" target="form">15 Tyson Huntsman</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Alpha/StephenAskew.html" target="form">16 Stephen Askew</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Alpha/KevinHolmes.html" target="form">20 Kevin Holmes</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Alpha/ElizabethJones.html" target="form">22 Elizabeth Jones</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Alpha/AndrewOrtoski.html" target="form">23 Andrew Ortoski</a></li>
       </ul>
    </li>

    <li><a href="#">Beta Class</a>
       <ul>
         <li><a href="http://usfthetatau.org/modules/Alumni/Beta/MoeKhawaja.html" target="form">26 Moe Khawaja</a></li>
       </ul>
    </li>

    <li><a href="#">Gamma Class</a>
       <ul>
         <li><a href="http://usfthetatau.org/modules/Alumni/Gamma/PatrickTynan.html" target="form">33 Patrick Tynan</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Gamma/JonathanTodd.html" target="form">35 Jonathan Todd</a></li>
         <li><a href="http://usfthetatau.org/modules/Alumni/Gamma/JoeJohnson.html" target="form">36 Joe Johnson</a></li>
       </ul>
    </li>

</ul>

</td>

<td width="200" valign="top">
</td>';
?>
<td valign="top" style="padding-left : 20px">
<iframe src="<?php echo"http://usfthetatau.org/modules/Alumni/".$class."/".$name.".html";?>" name="form" height="2000" width="440" scrolling="auto" frameborder="no" allowtransparency="true"></td>
<?php
</tr>
</table>
</body>
</html>


// close the table that we have created
CloseTable();

// there isn't any need to include the footer, as the index page handles this already
// require('footer.php');

Also, you do not need to echo the whole HTML and JavaScript code when you are using PHP, you can just end the PHP script and continue it after the HTML or JavaScript code.

Anyway, that's about it, hope I didn't make any mistakes and helped you.

Trakaa · August 2, 2009

I think it is close. It wont load the module though I think we forgot something.

http://usfthetatau.org/index.php?name=TysonHuntsman&class=Alpha Looks good but it has to look something like this

http://usfthetatau.org/index.php?name=Alumni&personsname=TysonHuntsmant&class=Alpha. The url for the module that loads people is http://usfthetatau.org/index.php?name=Alumni so I assume that has to be somewhere in the URL. I am just stuck to where to put the rest of the stuff.

_DarkLink_ · August 3, 2009

Hmm,

I made a search engine that pretty much looks the same for the url.

Try:

http://usfthetatau.org/index.php?personsname=TysonHuntsman&class=Alpha&name=Alumni

Hope it helps.

Sign In

Opening link with iframe target on different page

Recommended Posts

Trakaa

Link to comment

Share on other sites

bundyxc

Link to comment

Share on other sites

Trakaa

Link to comment

Share on other sites

gevans

Link to comment

Share on other sites

Trakaa

Link to comment

Share on other sites

gevans

Link to comment

Share on other sites

ldougherty

Link to comment

Share on other sites

Trakaa

Link to comment

Share on other sites

_DarkLink_

Link to comment

Share on other sites

Trakaa

Link to comment

Share on other sites

_DarkLink_

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information