Good morning!

I've been working on this logic for far longer than I care to enclose so I'm finally resorting to the forums.

Here's what I'm trying to do:

I have images in a directory as well as a database with the filename and category of the image. On my gallery page, I'm displaying thumbnails of each image in the category with a while() statement. I want to be able to click a thumbnail and display that image, bigger, in the main content area.

Here's my code. Logically, I feel like it should work and I've tried a number of things that have given no result.

PHP Code:
include "../inc/dbinc.php";

//SELECT IMAGES by Category
$strSQL mysql_query("SELECT * FROM gallery WHERE Category = 'Weddings' "); 
Code:
//Javascript (external)

function imageFocus(){

     var filename = document.getElementById("dynamicImg").value;
     
     //debug
     alert(filename);

     function showImageGallery(){
     
          //debug
          alert("showImage Func");

          if(filename != null){
               document.write(" <img src='../dashboard/imgs/" + filename + "' class='contentPic' ");
          }else{
               document.write("Click a thumbnail to begin...");
          }

     }

}
HTML Code:
<div id="mainContent">
     <script type="text/javascript"> showImageGallery(); </script>
</div>


<div id="thumbsDiv">
PHP Code:
while($row mysql_fetch_array($strSQL)){
     
          
$Filename $row['Filename'];
          
//$Category = $row['Category'];
          
          
echo " <img src='../dashboard/imgs/" $Filename "' class='thumbs' onclick='return imageFocus();' ";
          echo 
" <input type='hidden' id='dynamicImg' value='" $Filename "' ";

     } 
HTML Code:
</div>
With this bit of code, as you can see, I've set up 2 debug alerts. The problem is that I'm not even hitting the second alert (function showImageGallery() ). The first alert works and returns the proper filename.