I have been creating a website where my users can rate images that have been uploaded. Currently i use radio buttons and a submit button to get the users rating and save it within the system. I would like to change this so that the code uses image clicks to get the users rating. So far i have the following code however it only works for one image button. Is there any way to change this to get the result depending on what image has been clicked.
Code:
HTML
<form>
<input
type="image"
name="flag_submit"
src="img/Flag.png"
onmouseover="this.src='img/Flag_Click.png'"
onmouseout="this.src='img/Flag.png'"
height="30"
width="30"
/>
</form>
PHP
if (isset($_POST['flag_submit_x']))
{
//Do process of rating.
}
Is there any way that i could create multiple image buttons and in the PHP code detect what image button has been pressed?
Change name to an array name="flag_submit[1]"
. Assign a different value for each image and you got it.
Read it as an array on php side: if (isset($_POST['flag_submit'][1]))
.
Or better would be, loop throu if $_POST['flag_submit']
and find all values:
foreach ( $_POST['flag_submit'] as $value ) {
echo $value . ' has been clicked.';
}
<form method="post">
<input type="image" name="rateButton[1]" src="img/Rate1.png" height="40" width="40" value="1"/> T
<input type="image" name="rateButton[2]" src="img/Rate1.png" height="40" width="40" value="1"/> T
<input type="image" name="rateButton[3]" src="img/Rate1.png" height="40" width="40" value="1"/> T
<input type="image" name="rateButton[4]" src="img/Rate1.png" height="40" width="40" value="1"/> T
</form>
<pre>
<?php
if ( isset( $_POST['rateButton'] ) ) {
foreach ( $_POST['rateButton'] as $key => $value ) {
echo 'Image number '.$key.' was clicked.';
}
}
?>
In your case, you don't care, what value it sends, all you need to care about it is the key that was used to submit the form, because there will always be only one key set.
Here's a trick that might be of help:
I have created an HTML page of the form:
CODE
<html><body><form method="post" action="show_post.php">
<input type="image" name="stamp[1134118800]" src="redstar.gif" value="red">
<input type="image" name="stamp[1134140400]" src="greenstar.gif" value="green">
</form></body></html>
The script to which the form submits, show_post.php, reads:
CODE
<?php
print '<html><body><pre>';
print_r ($_POST);
print '</pre></body></html>';
?>
When I click on the first image, I get:
Array
(
[stamp] => Array
(
[1134118800] => 21
)
)
When I click on the second image, I get:
Array
(
[stamp] => Array
(
[1134140400] => 15
)
)
This works with Opera, IE, and Mozilla.
The First code works fine for me, the
Change name to an array name="flag_submit[1]". Assign a different value for each image and you got it.
Read it as an array on php side:
if (isset($_POST['flag_submit'][1]))
You can have multiple <button type="submit"> elements with the same name but different values that can contain the images, only the value of the one that has been clicked will be sent.
For more info, see the specification: http://www.w3.org/html/wg/drafts/html/master/forms.html#the-button-element
this might help you
<?php
if($_POST['button'])
{
echo "you have pressed button ".$_POST['button'];
}
?>
<style>
input.overridecss {
background-color: transparent;
border: 0px;
background-position: center;
background-repeat: no-repeat;
background-image: url(http://i49.tinypic.com/rm2w0i.png);
}
</style>
<form method="POST">
<input type="submit" name="button" value="1" class="overridecss"/>
<input type="submit" name="button" value="2" class="overridecss"/>
<input type="submit" name="button" value="3" class="overridecss"/>
<input type="submit" name="button" value="4" class="overridecss"/>
<input type="submit" name="button" value="5" class="overridecss"/>
</form>