I have a mySql query then from the data an array is created. With values from the array a dropdown list for a form is created. Then a javascript array is created from the php array. and an onchange() function is trying to change an image in a field, using the ID value from the dropdown list selection (dropd.value) as key in the Array (to display the image name).

include 'open_connection_con.php';
$prod_query = mysqli_query($con,"SELECT id, type, image_name, description FROM Products");
$products = array();
while($row = mysqli_fetch_array($prod_query))
		$products[] = $row;
// then I create a dropdown list within a form.
echo "<select name='prodType' id='prodDrop' onchange='swapProd()'>";
echo "<option value='0'>Select one:</option>";
foreach ($products as $row)
		echo "<option value='" . $row['id'] . "'>" . $row['type'] . "</option>";
echo "</select>";

<script type="text/javascript">

// pass the php array into a javascript array.
var prodArrJS = <?php echo json_encode($products);?>

// and the function to display the image (on <img id="prodImage">) of the selected product from the dropdown list above
function swapProd()
var image = document.getElementById("prodImage");
var dropd = document.getElementById("prodDrop");
image.src = "images/ex/" + prodArrJS[dropd.value][2] + ".jpg";
var p1=document.getElementById("lar");
unset( $products );
The image at the end of the function is not displayed (nothing is displayed, not even the little question mark) and the function stops.
I have tested the array with numbers and strings and it works ok.
Thanks in advance.