PHP multiple image button submit form

问题

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?

回答1:

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.

回答2:

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.

回答3:

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

回答4:

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

回答5:

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>

来源：https://stackoverflow.com/questions/14749744/php-multiple-image-button-submit-form

标签

php

html

submit

imagebutton