PDA

View Full Version : split an php/sql array to change an image



elwood773
05-13-2008, 09:14 PM
Hi guys,
I am quite new to javascript and I admit that I feel more confortable with php and c++ rather than JS. So, I am stuck in front of this bug since a little while and I would like to have your help, please.

Here's my problem: I work to fix up many things on an existing shopping cart website and I need to change the top image according to the selected color in a dropdown list. The issue is that list is generated in php by the reply from the sql database, not a simple index number from the dropdown list. So, I need to work with an array and explode it in several parts and here's where I lost my way. The color is the second item in the array. Could you have a look to the code I included, please. Thanks in advance for your help.


<script language="JavaScript" type="text/javascript">
function CngColor(obj){

var Path='http://www.xyz.com/images_products/xyz_colors/';
var str=obj.options[index].value;
var wantedColor=(str.split("||"));

index=obj.selectedIndex;
var wantedColor = obj.options[1].value
if (index<1){ return; }
document.getElementById('largeimage').src=Path+wantedColor;
}
</script>
<?
$id = $_GET['id'];
if(!preg_match('/^[a-zA-Z0-9]+$/', $id))
{
header('Location: ?page=message&id=2');
}
$sql = "SELECT DISTINCT products.num,name,color " .
"FROM products,product_detail " .
"WHERE products.num = product_detail.num AND product_detail.num ='". $id . "'";


$result = mysql_query($sql, $link);
$contents = mysql_fetch_assoc($result);
$numRows = mysql_num_rows($result);

if($numRows < 1)
{
header('Location: ?page=message&id=5');
}
$id = $contents['num']
?>
<h3><?= $contents['name'] ?></h3>
<table>
<tr><td><? print"<img id=\"largeimage\" src=\"images_products/large/" . $id . "_" .$contents['color'].".jpg\" onError=this.src='images/default_large.jpg' /></td><td><p>". $contents['desc']."</p></td>";?>
<td><table>
<?
$sql = "SELECT DISTINCT color " .
"FROM product_detail " .
"WHERE num ='". $id . "'";
$result = mysql_query($sql, $link);
while($colors = mysql_fetch_assoc($result))
{
if($id != 'r001')
{
print "<tr><td><img src=\"images_products/xyz_colors/" .$colors['color'].".jpg\" id=\"xyzcolor\" onClick=\"changeImage('".$id."','".$colors['color']."')\"/></td><td>".$colors['color']."</td></tr>" ;
}

}

?>
</table></td>
</tr>
</table>

<select name="dropdownlist" onchange="CngColor(this);">
<?
$sql = "SELECT * FROM product_detail " .
"WHERE num = '" . $id . "' ORDER BY size";
$result = mysql_query($sql, $link);
?>

<?
while($contents = mysql_fetch_assoc($result))
{?>

<option name="<?= $id ?>_details" type="radio" value="<?= $contents['size'] . "||" . $contents['color'] . "||" . $contents['price']?>" id="<?= $id ?>_details" >




<?=$contents['size'] . " - " . $contents['color'] . " - $" . number_format($contents['price'], 2, '.', ',')?></option><br />
<? }?></select><br/>
Please enter the amount you wish to purchase: <input type="text" id="<?= $id ?>_quantity" size="1" maxlength="3" value="1"/>
<input type="button" onClick="sendInfo('<?= $id ?>');" value="Add to cart"/>
<img src="images/wait_spacer.gif" alt="wait_spacer.gif" id="<?= $id ?>_img"/>
<div id="<?= $id ?>"></div>
<a href="?page=viewCart&id=">View Cart</a>