add PHP array content to a Javascript array

Hi,
i can't find the mistake in my little script hope someone can help me.


<?php

/* -------------------- read thumbfolder -------------------- */

function isRdyPfD($filename){

if ($filename == '.' || $filename == '..') {
// To-Top-Dir
return false;
}

$ext = explode(".",$filename);
$ext = $ext[sizeof($ext) - 1];
$allowedformats = array (
'jpg',
'png',
'jpeg',
'gif'
);

return in_array($ext,$allowedformats);
}

function getPicsfromDir($dir){
/* array with names of the pictures in $dir */

if (is_dir($dir)) {
if ($dh = opendir($dir)) {
$filearray = array();
while (($file = readdir($dh)) !== false) {
if (isRdyPfD($file) === true) {
$filearray[] = $file;
}
}
closedir($dh);
return $filearray;
}
}
else {
return false;
}
} // End Function


$thumbs = getPicsfromDir("./images/thumbs/");


/* -------------------- thumbfolder -------------------- */
echo "<div id='thumbslider'>\n";
echo "<ul id='thumbs'>\n";
for($i = 0; $i < count($thumbs); $i++){
echo "<li><img src=\"./images/thumbs/$thumbs[$i]\" onclick=\"thumbClick($i)\" /></li>\n";

}
echo "</ul>\n";
echo "</div>\n";





/* -------------------- big size images folder -------------------- */
$bigSizeImages = getPicsfromDir("./images/");
//print_r($bigSizeImages);

$jsValue = '';
for ($j=0; $j < count($bigSizeImages); $j++){
$jsValue = $jsValue . $bigSizeImages[$j];
if ($j < (count($bigSizeImages)-1)) {
$jsValue = $jsValue . ",";
}
}

?>


<script type="text/javascript">
images = new Array(<?php echo $jsValue ?>);





function thumbClick(pos){

//alert(pos);
alert(images[pos]);

}

</script>




I can't trace the images array values?
thanks for a feedback!!!

You don't have "..." or '...' around your array elements, so JS will barf on your feet when it sees something like
images = new Array(abc.jpg, xyz.jpg);

JS *needs* to see
images = [ "abc.jpg", "xyz.jpg" ];


I don't code in PHP, but I would think that all you need is this:

$jsValue = '';
for ($j=0; $j < count($bigSizeImages); $j++)
{
$jsValue .= ( $j > 0 ? "," : "" ) . "'" . $bigSizeImages[$j] . "'";
}

And then

var images = [<?php echo $jsValue ?>];

But you surely could have also done:

<script type="text/javascript">
var images = [
<?php
for ($j=0; $j < count($bigSizeImages); $j++)
{
echo ( $j > 0 ? ",\n" : "" ) . "'" . $bigSizeImages[$j] . "'";
}
?>
];
...

Which would possibly be a shade faster, since we all know how bad it can be to create long strings via concatenation.

..it works fine. thank you so much for your help!!!!!
have a great day!

You can also use a php built-in function that converts all php arrays to json arrays that can be used in javascript, it can also encode multidimensional array for example.

This code:

<?php
$phpArray1 = array('hello','world');
$phpArray2 = array(
"example" => array("hello"=>"world"),
"names" => array("john"=>"doe")
);
?>
<script type="text/javascript">
var jsArray1 = <?php print json_encode($phpArray1); ?>;
var jsArray2 = <?php print json_encode($phpArray2); ?>;
window.onload = (function(){
alert(jsArray1);
alert(jsArray2);
});
</script>


Results in:

<script type="text/javascript">
var jsArray1 = ['hello','world'];
var jsArray2 = {"examples":['hello','world'],"names":['john','doe']};
window.onload = (function(){
alert(jsArray1);
alert(jsArray2.examples);
alert(jsArray2.names);
});
</script>