Hi All,
I was wondering if anyone could help me with this one.
If you want to see what I have at the moment goto http://www.personally-yours.co.uk/indev/test/state_dropdown.php
This page has two drop downs, the bottom one is populated depending on what is selected in the top one.
What I want to do is have the appropriate image displayed when something is selected in the second drop down. So for example if 15mm x 15mm Badge (P-10) is selected I want the image of the product to be displayed.
All the image paths are stored in the database using the field name 'imgurl'.
The code I have at the moment is as follows:
state_dropdown.php - Displays the information.
<?
echo "<form name=sel>\n";
echo "Choose Gift Type : <font id=gift><select>\n";
echo "<option value='0'>============</option> \n" ;
echo "</select></font>\n";
echo "Choose Your Gift : <font id=gifttype><select>\n";
echo "<option value='0'>=== none ===</option> \n" ;
echo "</select></font>\n";
?>
<script language=Javascript>
function Inint_AJAX() {
try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} //IE
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //IE
try { return new XMLHttpRequest(); } catch(e) {} //Native Javascript
alert("XMLHttpRequest not supported");
return null;
};
function dochange(src, val) {
var req = Inint_AJAX();
req.onreadystatechange = function () {
if (req.readyState==4) {
if (req.status==200) {
document.getElementById(src).innerHTML=req.responseText; //retuen value
}
}
};
req.open("GET", "state.php?data="+src+"&val="+val); //make connection
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=iso-8859-1"); // set Header
req.send(null); //send value
}
window.onLoad=dochange('gift', -1); // value in first dropdown
</script>state.php - behind the scenes processing.
<?
//set IE read from page only not read from cache
header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header ("Cache-Control: no-cache, must-revalidate");
header ("Pragma: no-cache");
header("content-type: application/x-javascript; charset=tis-620");
$data=$_GET['data'];
$val=$_GET['val'];
//set database
$dbhost = "*********";
$dbuser = "*********";
$dbpass = "*******";
$dbname = "*******";
mysql_pconnect($dbhost,$dbuser,$dbpass) or die ("Unable to connect to MySQL server");
if ($data=='gift') { // first dropdown
echo "<select name='gift' onChange=\"dochange('gifttype', this.value)\">\n";
echo "<option value='0'>==== choose gift type ====</option>\n";
$result=mysql_db_query($dbname,"select `gift_id`, `gift_type` from gifttest order by `gift_type`");
while(list($id, $name)=mysql_fetch_array($result)){
echo "<option value=\"$id\" >$name</option> \n" ;
}
} else if ($data=='gifttype') { // second dropdown
echo "<select name='gifttype'>\n";
echo "<option value='0'>====choose your gift ====</option>\n";
$result=mysql_db_query($dbname,"SELECT `gift_id`, `desc` FROM giftdesc WHERE `gift_id` = '$val' ORDER BY `desc` ");
while(list($id, $name)=mysql_fetch_array($result)){
echo "<option value=\"$id\" >$name</option> \n" ;
}
}
echo "</select>\n<br><br>";
?>Any help on this would be great, thanks for looking. I'm a relative newbie to this so any help would be grateful :D
Brett