Dynamic Populated Div

[dfowler]

Hey guys, I'm trying to set up a system where depending on what you pick with a dropdown it will create a list of links within a div.  Here is the database structure:

categories

id

name

description

parent_id

date

 

pdfs

id

name

location

date

 

cat_pdfs

id

cat_id

pdf_id

 

The first database (categories) is going to be the dropdown list.  It will look something similar to this:

<?php
$query1 = "SELECT * FROM categories";
$result1 = mysql_query($query1);
$cats = array();
while (($row = mysql_fetch_assoc($result1)) !== false) {
  $cats[] = $row;
}
?>
Category: <select name="cat">
<option value="0"></option>
<?php foreach($cats as $c) { ?>
	<option value="<?php echo $c['id']; ?>"><?php echo $c['name']; ?></option>
<?php } ?>
</select>

 

What I am hoping is that when you pick a category it will take that number and reference it with the cat_pdfs table to find the pdf_id.  Then using that id select the appropriate pdf(s) from the pdfs table.  Then I would like to do something like this:

<a href="pdfs:location">pdfs:name</a>

To populate the div.

 

 

I have no clue how to do this.  I've done something similar with dropdowns before, but I can't figure it out with populating a div.  Thanks for any help!

[dfowler]

Ok, I think I might have gotten this to work, but here is my new problem now.  I can do this exactly if I use just regular links instead of a dropdown list.  Does anybody have a script so that I can use a dropdown list for links?

 

Here is my script:

<?php
include 'admin/system.php';

$query1 = "SELECT * FROM categories";
$result1 = mysql_query($query1);
$cats = array();
while (($row = mysql_fetch_assoc($result1)) !== false) {
  $cats[] = $row;
}
?>
<script type="text/javascript">

/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects=""
var rootdomain="http://"+window.location.hostname
var bustcacheparameter=""

function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
} 
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}

function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}

function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}

</script>
Categories:<br />
<?php foreach($cats as $c) { ?>
<a href="javascript:ajaxpage('pdfs.php?id=<?php echo $c['id']; ?>', 'pdfs');"><?php echo $c['name']; ?></a><br />
<?php	} ?>
<div id="pdfs"></div>

 

pdfs.php

<?php
include 'admin/system.php';

$cat_id = $_GET['id'];

$query = "SELECT * FROM cat_pdfs WHERE cat_id='$cat_id'";
$result = mysql_query($query);
$catid = array();
while (($row = mysql_fetch_assoc($result)) !== false) {
  $catid[] = $row;
}

pdfs=array();
foreach($catid as $c) {
$query2 = "SELECT * FROM pdfs WHERE id='".$c['pdf_id']."'";
$result2 = mysql_query($query2);
while (($row2 = mysql_fetch_assoc($result2)) !== false) {
  $pdfs[] = $row2;
}

?>

[dfowler]

I ended up just completely reworking my thinking behind this.  Here is the new script and it works perfectly!

<?php
include 'admin/system.php';

$query1 = "SELECT * FROM categories";
$result1 = mysql_query($query1);
$cats = array();
while (($row = mysql_fetch_assoc($result1)) !== false) {
  $cats[] = $row;
}

if (!$_GET['id']) { ?>
	<form name="form1">
		<select name="categories" ONCHANGE="location=this.options[this.selectedIndex].value;">
		<option selected>--- Choose a Category to Browse ---</option>
				<?php foreach($cats as $c) { ?>
				<option value="http://www.site.com/index.php?id=<?php echo $c['id']; ?>"><?php echo $c['name']; ?></option>
				<?php } ?>
			</select>
	</form>
</td>
<?php
} else {
$cat_id = $_GET['id'];

$query = "SELECT * FROM cat_pdfs WHERE cat_id='$cat_id'";
$result = mysql_query($query);
$catid = array();
while (($row = mysql_fetch_assoc($result)) !== false) {
$catid[] = $row;
}

$pdfs=array();
foreach($catid as $c) {
$query2 = "SELECT * FROM pdfs WHERE id='".$c['pdf_id']."'";
$result2 = mysql_query($query2);
while (($row2 = mysql_fetch_assoc($result2)) !== false) {
	$pdfs[] = $row2;
}
}
?>
	<form name="form1">
			<select name="categories" ONCHANGE="location=this.options[this.selectedIndex].value;">
			<option selected>--- Choose a Category to Browse ---</option>
			<?php foreach($cats as $c) { ?>
				<option value="http://www.site.com/index.php?id=<?php echo $c['id']; ?>"><?php echo $c['name']; ?></option>
			<?php } ?>
		</select>
	</form>
	<div id="pdfs">
		<table>
		<?php foreach($pdfs as $p) { ?>
			<tr>
				<td><a href="<?php echo $p['location']; ?>" target="_blank"><?php echo $p['name']; ?></a></td>
				<td><a href="<?php echo $p['location']; ?>" target="_blank"><?php echo $p['date']; ?></a></td>
			<tr>
		<?php } ?>
		</table>
	</div>
</td>
<?php
}
?>