I've created a photo competition where when users see themselves in a photo they click the (I'm in this photo) callout.
This pops up a form for them to fill in. I've had no problems collecting the data from the form and saving it to a database.
My issue is that I need to be able to reference the photo that they were in.
Firstly I need to transfer the photo name/id from the first page to the second pop out Competition entry form page, and from there I need to be able save both to the database.
Any suggestions? I've tried using a session variale to call the photo name/id from the first page to the second.
Any help will be greatly appreciated.
UPDATED CODE:
Page 1: Photo gallery sample. Tried hidden form fields to call data, but obviously it doesn't call the photo info from those hidden fields.
<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>
</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: Competition entry page with 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>
Page 3: My form data 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);
There are no values in input
tags.
<form method="POST" action="compentry.php" onClick="wopen('compentry.php', 'popup', 448, 590); return false;">
<input type="hidden" name="photoName">
<input type="hidden" name="photoID">
<input type="image" src="assets/inphotobutton.jpg" name="submit" value="" class="submit" alt="Submit">
</form>
You may:
<form method="POST" action="compentry.php?imageid=<?php echo ...; ?>"
and retrieve it in the 2nd form<input type="hidden" name="photoId" value="...">
(you forgot the value
tag).Using POST in your example is yet not possible as you have no submit button. Instead of <input type="image"
you need input type="submit"
. But submitting will not open another window, so you need to pass the variable other way.
Therefore I would stay in the 1st option, no <form>
is however required, so make the code like this:
<a href="#" onclick="wopen('compentry.php?imageid=<?php
echo $imageID; // here goes PHP code
?>', 'popup', 448, 590); return false;">Click to open form</a>
In the competition form you know what picture you're about by using $_GET['imageid']
.
EDIT
You need to decide how you want to achieve your goal. If you use form
you can pass parameters by get or post method. However, you can also pass your variables with get method putting them into the URL.
Because the second way is simpler, I told you to remove the entire form
tag and pass your image id by calling this site in a
tag's onclick
event, but you can choose any tag you like (I suggest to use that div
from your first comment).
This calling is being done when I open the page in this line onclick="wopen('compentry.php?imageid=***', 'popup', 448, 590);
, where you need in place of ***
insert your image id. I proposed PHP echo
function and this is how it's usually done.
Your 1st page requires nothing more. Clicking on the element will make popup and send request to the compentry.php passing the imageid variable by get method. The same would be if you make a form, method get, action compentry.php, hidden input
field "imageid" value . You can see that calling the URL compentry.php?imageid= is much simpler than all this form
stuff.
That's all -- when you are ready you must code the popup page. This is your second comment. This image id is to be retrieved by $_GET["imageid"]
. So if this is also a form having however many fields, here the post method (not get) would be recommended.
So this line
<input type="hidden" name="photoId" value="photoID">
should look (in PHP) something like
echo '<input type="hidden" name="photoId" value="' . $_GET['imageid'] .'">
You need to put the image id you got from the 1st page by $_GET["imageid"]
to the HTML of the 2nd page so that you can send it further to the last page.
Summary
<div onclick="wopen('compentry.php?imageid=***', 'popup', 448, 590);">
. Code marked with ***
is inserted by PHP and contains image id.compentry.php?imageid=***
<form action="form.php" method="post">
(or get if you prefer)<input type="hidden" name="imageid" value="####">
where it is required, that in the place the server (PHP in fact) will echo
contents of what is in $_GET['imageid']
what it received from photogallery.imageid
, which has the same name (might have different, no problem), but the same value as in the photo gallery.