php to Javascript array (MySQL values)

**Ceeege** · 11-07-2008, 03:27 PM

Hi folks,

I’m trying to implement and adapt a JavaScript slideshow script I’ve found to populate a JavaScript array with image information from a database rather than using a set of hard coded pre-defined values. My web pages are php and I can quite happily build the php array from MySQL which contains the image information I’d like to display in the slideshow.

Basically, I’m trying to populate the JavaScript array slides into the same format as is displayed at the bottom of this post from a MySQL Query via php to ultimately output a slideshow webpage but really struggling with no JavaScript knowledge and only the php I’ve absorbed so far. How do I get the array elements into JavaScript? I know I’m going to need a php loop to assign the php array values into the JavaScript array somehow but quite how it’s done I have no idea. I’d really appreciate a solution over tips as I’ve been banging my head against a brick wall over this for far too long now!

Thanks in advance,

Chris.

<html>
<title>Php/MySQL Array to JavaScript Array</title>
<head>

<?php

$dbQuery = 'SELECT BirdPics_Filename,BirdPics_Species,BirdPics_Page FROM ' .$SQLWhere;
$dbResult = mysql_query($dbQuery) or die ("Could not read data because " . mysql_error());
$RowCount = mysql_numrows($dbResult);

$dbCount = 0;

while ($slides = mysql_fetch_assoc($dbResult))
{
echo "Count : $dbCount " .
"Species : {$slides['BirdPics_Species']} " .
"Link : {$slides['BirdPics_Page']} " .
"Image : {$slides['BirdPics_Filename']} ";
$dbCount ++;
}

?>

</head>

<body>



</body>
</html>

Sample Output from the above
============================
Count : 0
Species : Redstart
Link : Birds_CWA_Redstart.php
Image : Birds/18ChatsWrensAccentors/Redstart/2008-05-24_Redstart_02.jpg

Count : 1
Species : Firecrest
Link : Birds_WarblersFlycatchers_Firecrest.php
Image : Birds/20WarblersFlycatchers/Firecrest/2008-03-02_Firecrest01.jpg

Count : 2
Species : Redstart
Link : Birds_CWA_Redstart.php
Image : Birds/18ChatsWrensAccentors/Redstart/2008-05-24_Redstart_01.jpg

etc...

Count : 11
Species : Bullfinch
Link : Birds_FinchesBuntings_Bullfinch.php
Image : Birds/25Finches/Bullfinch/2008-04-16_Bullfinch_01.jpg

How and where do I Populate a Javascript array slides from the php array $slides to give:

===========================================================================================

slides[0] = ["Birds/18ChatsWrensAccentors/Redstart/2008-05-24_Redstart_02.jpg", "Redstart", "Birds_CWA_Redstart.php"];

slides[1] = ["Birds/20WarblersFlycatchers/Firecrest/2008-03-02_Firecrest01.jpg", "Firecrest", "Birds_WarblersFlycatchers_Firecrest.php"];

Up to ...

slides[$dbcount] = ["Birds/25Finches/Bullfinch/2008-04-16_Bullfinch_01.jpg", "Bullfinch", "Birds_FinchesBuntings_Bullfinch.php"];

**Jesdisciple** · 11-07-2008, 08:09 PM

First, I suggest this alternative format for each result, because it's more descriptive of what the data being accessed is:

Code:

{ image: 'Birds/20WarblersFlycatchers/Firecrest/2008-03-02_Firecrest01.jpg', species: 'Firecrest', link: 'Birds_WarblersFlycatchers_Firecrest.php' };

However, that format requires that you tweak your slideshow script a bit to access the values via properties (or string indexes) rather than numerical indexes. (In both formats, the indexes of the outer array are automatically determined by the JS engine.)

For how these loops work, see Arrays and implode.

Here's a while loop that outputs my format:

Code:

while ($slides = mysql_fetch_assoc($dbResult))
{
    $array[] = "{ image: {$slides['BirdPics_Filename']}, species: {$slides['BirdPics_Species']}, link: {$slides['BirdPics_Page']} }";
}
echo 'var slides = [' . implode(', ', $array) . '];';

And this one outputs yours:

Code:

while ($slides = mysql_fetch_assoc($dbResult))
{
    $array[] = "[ {$slides['BirdPics_Filename']}, {$slides['BirdPics_Species']}, {$slides['BirdPics_Page']} ]";
}
echo 'var slides = [' . implode(', ', $array) . '];';

**Ceeege** · 11-17-2008, 11:15 PM

Many thanks for getting back to me on this. It's making more sense now but I'm still a bit confused on it. Can I send you my source and let me know what I'm doing wrong?

I think I may be too ambitious with what I'm trying to ultimately achieve!

Thread: php to Javascript array (MySQL values)

Thread Tools

Search Thread

php to Javascript array (MySQL values)

The Following User Says Thank You to Jesdisciple For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions