Arrays with PHP/Javascript

geogal

Hi Folks,

Can someone tell me how to create a dynamic array from a MySql query? I'm trying to create a slideshow mixing PHP and Javascript and am having trouble getting my mind around plugging my PHP variable into Javascript.

I can create a slideshow using strictly Javascript, hard-coding my images, but I need to pull the images from a database query. Here is my SQL:

$sql = "SELECT image WHERE ID=$ID"; <--- can be 4-8 rows
$result = mysql_query($sql);

while ($myrow = mysql_fetch_row($result)) {
$bad = ("../");
$title = $myrow[0];
$comments = $myrow[1];
$image = str_replace($bad,"",$myrow[2]);

}

How do I take this query and put an array in the this Javascript:

<!--
var picture = new Array("PHP ARRAY") <---- ???
var picNumber=1
var numberofPics = picture.length

function previousPicture(){
if(picNumber > 1){
picNumber--
}
document.myPicture.src=picture[picNumber-1]
}
function nextPicture(){
if(picNumber < numberofPics){
picNumber++
}
document.myPicture.src=picture[picNumber-1]
}
//-->

</script>

Any help in merging these two languages will be greatly appreciated. I will continue my search; Javascript just plain confuses me.

Thanks! 🙂

dalecosp

Javascript just plain confuses me...

LOL, me too.

What does your JS need in there? As far as the browser's concerned, you can put as much PHP code as you need in between those quote marks.

If all your JS needs is a list of image URI's ...

<?php
$sql = "SELECT image WHERE ID=$ID"; 
//can be 4-8 rows
$result = mysql_query($sql);
$imgarray=array();  // set it up here
$z=0;

while ($myrow = mysql_fetch_row($result)) {
$bad = ("../");
$title = $myrow[0];
$comments = $myrow[1];
$image = str_replace($bad,"",$myrow[2]);
$imgarray[$z]=$image;
$z++;
}
?>
<SCRIPT Language="JavaScript">

<!--
var picture = new Array("<?php
while ($zz<$z) {
      echo "'".$imgarray[$zz]."'";
      $zz++;
      if ($zz!=$z) {
            echo ",";
      }
}
?>")
var picNumber=1
var numberofPics = picture.length

function previousPicture(){
if(picNumber > 1){
picNumber--
}
document.myPicture.src=picture[picNumber-1]
}
function nextPicture(){
if(picNumber < numberofPics){
picNumber++
}
document.myPicture.src=picture[picNumber-1]
}
//-->
</script>

Dunno that this is it exactly, but might give you an idea?

geogal

Thanks so much for the code. I didn't even know you could embed PHP into Javascript (I'm such a rookie).

I get the first of my 6 images in the slideshow box, but when I click on the "next" link, I get a missing image icon and the source reads the entire array. I'm going to continue looking at it. Thanks so much for the direction!

Geogal