Jump to content

Recommended Posts

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.
 

 

 

 

 

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

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.

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.

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?

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.

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)"

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.