PHP Form Submission: Recognize Image Input Buttons

By  on  

As you probably know, you can recognize a form submission from a "submit" input type by placing the following code in the "processing" PHP script:

if(isset($_POST['submit'])) { /* do stuff */ }

Did you know, however, that when using an "image" input type to submit the form, the above wont work? You need to add a "_x" to the field name in PHP:

if(isset($_POST['submit_x'])) { /* do stuff */ }

Odd, huh? This works the same when using a form "GET" method.

Recent Features

  • By
    LightFace:  Facebook Lightbox for MooTools

    One of the web components I've always loved has been Facebook's modal dialog.  This "lightbox" isn't like others:  no dark overlay, no obnoxious animating to size, and it doesn't try to do "too much."  With Facebook's dialog in mind, I've created LightFace:  a Facebook lightbox...

  • By
    Chris Coyier’s Favorite CodePen Demos

    David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

Incredible Demos

  • By
    background-size Matters

    It's something that makes all men live in fear, and are often uncertain of. It's never spoken, but the curiosity is always there. Nine out of ten women agree in the affirmative. Advertisers do their best to make us feel inadequate but...

  • By
    Create an Animated Sliding Button Using MooTools

    Buttons (or links) are usually the elements on our sites that we want to draw a lot of attention to. Unfortunately many times they end up looking the most boring. You don't have to let that happen though! I recently found a...

Discussion

  1. The _x and _y represent the coordinate location you clicked the image at.

  2. Think this is only an issue with IE.

  3. Yeah. The _x- and _y-coordinates are great for improving the security of a form! I’ve used this to determine if the form has been filled by a human. A spam-bot won’t submit any coordinates but a human has to click on the button and so there will always be coordinates (you’ll have to deactive submitting with the ENTER-button).

  4. @Matthias: Good point on the security enhancement — I’ve never though of that!

  5. Braxo

    @ Matthias

    Thanks for posting your comment. I think telling the user that the ENTER button has been deactivated for bot protection is easier than having the user type in a captcha.

    I’ll definitely be looking into that method and most likely incorporating it into my projects.

  6. @Braxo – Wait – “Enter button” is deactivated? How would this affect someone who cannot use a mouse/relies on accessibility tools to fill out forms and the like?

    Some sites cannot get away with it (coughtargetcough).

  7. You can save yourself the trouble and just give the input a name attribute and check for that. Saves from changing code in two places (the input and the PHP submit validation).

    <input type="image" src="image.png" name="submitted" value="Submit" />

  8. I should clarify that…

    It saves from changing code in 2 places should you want to change to/from an image submit or a standard submit.

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!