theMack Posted May 21, 2013 Share Posted May 21, 2013 Hi, sorry if this has come up before. I had a quick look through the forum but could find anything. I've been having a problem with this code for the last while and I can't seem to figure it out. I'm not all that proficient in PHP. I've a gallery of images from a festival. When people looking through the photo's spot themselves they click a callout "I'm in this photo!' When they click the call out a window pops up with a form. I need the imageID to transfer to that form, and then after completion of that form gets saved to the data base. Page 1: The Gallery. <li> <a class="thumb" name="007" id="007" href="images/9133440_DSC_0087.jpg" title="Title #6"> <img src="images/9133440_DSC_0087_thumb.jpg" alt="Title #6" /> </a> <div class="caption"> <!-- <div class="image-desc">Description</div> --> </div> </li> </ul> </div> <div id="inphoto"> <a href="#" onclick="wopen('compentry.php?imageid=<?php echo $imageID; ?>', 'popup', 448, 590); return false;"><img src="assets/inphotobutton.jpg"></a> </div> Page 2: The Competition Form. <div id="form"> <form name="epcomp" id="epcomp" method="GET" action="form.php" > <p class="name"><label>Full Name:</label><br/> <input type="text" name="name" id="name" value="Your Name" onblur="if(this.value == '') { this.value='Your Name'}" onfocus="if (this.value == 'Your Name') {this.value=''}" maxlength="30" required/></p> <p class="email"><label>Your Email:</label><br/> <input type="email" name="email" id="email" value="Your email" onblur="if(this.value == '') { this.value='Your email'}" onfocus="if (this.value == 'Your email') {this.value=''}" maxlength="60" required /> </p> <p class="entry"><label>Your favourite festival moment: <span style="font-size:10px;">(Max 50 words)</label> <br/> <p><textarea cols="40" rows="5" name="entry" id="entry" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" maxlength="50" required>Enter you answer here...</textarea></p> <p class="button"><input class="button" type="submit" value="Enter Competition" name="formSubmit"/></p> <?php echo '<input type="hidden" name="photoId" value="' . $_GET['imageID'] . '">' ?> </form> And Page 3: The Form.php page. $imageID = $_GET['imageID']; $varName = $_GET['name']; $varEmail = $_GET['email']; $varEntry = $_GET['entry']; $query = "insert into comp_entry (imageID, name, email, entry) values ('$imageID' , '$varName' , '$varEmail' , ' $varEntry')"; $qresult = mysql_query($query); ?> <input class="button" type="button" value="Close" onclick="closeWin()"> </div> Can anyone point me on the right path, any help would be greatly appreciated. Quote Link to comment Share on other sites More sharing options...
Muddy_Funster Posted May 21, 2013 Share Posted May 21, 2013 I would use jquery to pop the window. assign each image with an ID attribute that marches your $imageID and then use the $(this) abbreviation in the onclick event to get the ID and pass it into the URL. the rest of it is pretty much there as you have it Quote Link to comment Share on other sites More sharing options...
theMack Posted May 21, 2013 Author Share Posted May 21, 2013 I had a jQuery version initially but changed it to bring the data across. Could you possibly show what you mean? Quote Link to comment Share on other sites More sharing options...
Muddy_Funster Posted May 22, 2013 Share Posted May 22, 2013 I'm not sure how your generating your images, or what the content of your $imageID is, but in a limited example kind of way it would be something like <?php$imageID = array ( array("130520-001", "9133440_DSC_001.jpg"), array("130520-002", "9133440_DSC_002.jpg"), array("130520-003", "9133440_DSC_003.jpg"), array("130520-004", "9133440_DSC_001.jpg") );// the array above is a substitute for your data //load the javascript and the header - again, substitute for your linked files$pageHead = <<<PAGE_HEADER<!DOCTYPE html><html lang="en"><head><title>Muddy's Sample</title><script type="text/javascript" src="path/to/your_JQuery.js"></script><script type="text/javascript">$(function(){ function wopen(id, method, hei, wid){ alert("this would run your function, using the id of -"+id+"- and your other attributes of \""+method+", "+hei+", "+wid+"\""); }});</script></head><body>PAGE_HEADER;echo $pageHead;foreach ($imageID as $image){ $show_img = <<<SHOW_IMG<li><a class="thumb" name="{$image[0]}_t" id="($image[0]_t" href="images/{$image[1]}.jpg" title="Title #6"><img id="{$image[0]}_i" src="images/{$image[1]}_thumb.jpg" alt="Title #6" /></a><div class="caption"><!-- <div class="image-desc">Description</div> --></div></li></ul></div><div id="inphoto"> <a id="{$image[0]}" onclick="wopen($(this).id, 'popup', 448, 590); return false;"><img src="assets/inphotobutton.jpg"></a> </div> SHOW_IMG; echo $show_img;}echo "</body>\r\n</html>";?> It's not really that close to your's but it should let you get what I mean. Just remember and point the <script> tag's source to your jquery library. Quote Link to comment Share on other sites More sharing options...
theMack Posted May 22, 2013 Author Share Posted May 22, 2013 You've lost me a little there with the way you went about it. The gallery is a simple list of thumbnails calling the larger image when clicked, as shown in the first set of code. All images are the same. I just need that first piece to call the image id and reference it in the pop out entry form page. To save all details to a database. Everything else is working and saving except the capturing of the image id field. Quote Link to comment Share on other sites More sharing options...
Muddy_Funster Posted May 22, 2013 Share Posted May 22, 2013 OK, give me the full step by step. how are you getting the image info onto the page? is it coming from a database or is it all hard coded? do you have a copy of the jquery library stored on your server? if so what's the path to it? Quote Link to comment Share on other sites More sharing options...
theMack Posted May 22, 2013 Author Share Posted May 22, 2013 The images are hard coded and are being called from an images folder. Jquery is being called from a the jquery folder also for the gallery to work. Should I have the images in the database? I'm working on this locally through Localhost at the moment before I put it live. Quote Link to comment Share on other sites More sharing options...
Eiseth Posted May 22, 2013 Share Posted May 22, 2013 Why not put the ids in the attribute like value="" of the <img>? Then after that get the value using jQuery then you can concatenate the id in the link Quote Link to comment Share on other sites More sharing options...
Muddy_Funster Posted May 22, 2013 Share Posted May 22, 2013 you shouldn't put images into the database, but it is quite common to put the path and other information in there, so you have easier control over the image. if the inforation is hard coded, just give each link the id of the image it represents and call onclick="wopen('compentry.php?imageid='+$(this).id, 'popup', 448, 590)" Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.