Jump to content

Display content onClick link in own page


Remote Control

Recommended Posts

Hi All,

 

I would like to display content in a div depending on which link a user clicks, below is the code that creates the links.

 

<?php
$sql="SELECT * FROM bands ORDER BY title";
//echo $sql;
$res=SQL_query($sql);
echo "<table>";
while ($row=SQL_fetch_array($res)){
		echo "<tr><td>";
		$ren_url=make_redundant_url($row['title']);
		echo "</td><td><a href='release_info.php?id=".$row['id_band']."$ren_url'>".$row['title']."</a></td>";

		echo "</tr>";
}			
echo "</table>";			
?>

 

And here is the code I would like to display when the link is clicked

 

<?phpwhile ($row=SQL_fetch_array($res)){

		if ($flag==0){
				echo "<h1></h1> 
								</div>
								<div class=\"content_holder\"><div class=\"catalogue_item\">";

			if ($row['mp3']<>""){
				echo "<p><b>Download MP3:</b> <a href=\"uploads/mp3s/".$row['mp3']."\">".$row['mp3']."</a></p><br>";
			}
			echo "<b>Releases:</b><br>";
			$flag=1;
		}
		//TODO: new catalogue page.
		$ren_url=make_redundant_url($row['bandname'],$row['title']);
		echo "<img src='tinyimage.php?file=uploads/releases/".$row['imageurl']."' border='0'><a href='release_detail.php?id=".$row['id_release']."$ren_url'>".$row['bandname']." "".$row['title']."" ".$row['type']." $".$row['price']." (".$row['catnum'].")</a>";
			 if ($row['new']==1){
				echo " <b><font color='#FF0000'>NEW!!</font></a></b> ";
			 }			
			 if ($row['sold_out']==0){
						echo "  (<a href='basket.php?add="."cd_".substr($row['catnum'],-3)."'><i>Add To Basket</i></a>)";
			 }
		echo "<br>";
}?>

 

What would  be the best way to display this without having to load a new page?

Don't repost, just remeber for the future. I will not write the code for you, but will point you in the direction.

How i would do it is using Javascript, with the onclick event, and either use innerHTML or just css visibility property's.

 

e.g.

<script>
function ClickMeInnerHTML(ID)
{
div = document.getElementById(ID);
div.innerHTML = "This was wrote by javascript"
}

function clickMeCSS(ID)
{
div = document.getElementById(ID);
div.style.visibility = "visible"// if it doesnt work try div.style.visibility = true
}
</script>

<a href="Javascript:ClickMeInnerHTML('test2');">Inner HTML</a>
<a href="Javascript:clickMeCSS('test');">CSS way</a>
<span id="test" style="visibility:hidden;">Hidden then revealed</span>
<br>
<span id="test2"></span>

Un-tested.

I think he wants to return a full page, not just a string of text?

 

Like Blade said earlier, look into AJAX and how you can make HTTP requests, a good example of what we're talking about is .. http://www.w3schools.com/Ajax/tryit.asp?filename=tryajax_httprequest_js1

 

But I'd have a good read through a tutorial first before trying to make your own..

 

If you were to setup your own javascript function which used AJAX to return a page, you could simply have the links set to something like:

 

<a href="javascript:loadPage('mypage.php');">My Page</a>

 

and a quick tip for you, because not every user has JS, you'd be best using:

 

<a href="mypagefull.php" onclick="loadPage('mypage.php'); return false;">My Page</a>

 

Which in the circumstance that the function fails to return the page, or the user has JS disabled, will just redirect them to the actual page and avoid any loss of function..

 

Post was a bit rushed cause I'm about to leave work :P

 

Adam

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.