Image as buttons (and IE issues)

Oh, this one was going to drive me NUTS! I had to use images as buttons in a form. That’s easy enough:

<input type="image" SRC="blahButton.gif" ALT="blah" name="blah" id="blah" value="blah" />

Which works fine when simply submitting the form when there’s ONE button. But on one page I had TWO buttons. The form would submit to itself, and then depending on which button was clicked, I would handle the form as appropriate. Worked fine in firefox - nothing happened in IE. I found this page in a search.

What I had been doing was simply (in php)

if (isset($_POST["blah"])) {
//do stuff
} else if (isset($_POST["blahblah"])) {
//do different stuff
}

What fixed the problem was changing that code to this:

if (isset($_POST["blah_x"])) {
//do stuff
} else if (isset($_POST["blahblah_x"])) {
//do different stuff
}

Now my form works…

4 Responses to “Image as buttons (and IE issues)”

  1. Karan Says:

    that’s not a lot of change, really… what’s the reason that this small difference works?

  2. Jennifer Says:

    IE won’t send the post variable without the “_x” (or without a “_y” - so it’s small change, but without it - it won’t work. (See the link I found - it explains it in more depth)

  3. Mark J Says:

    Bah, that link requires registration. So what is the _x and _y stuff? Is that like the coordinates of where on the image you clicked or something?

  4. Jennifer Says:

    No way. Really? I get in just fine as “guest”

    Well - I’ll copy the “good” parts from the thread there:
    ………………………………..
    POSTED QUESTION:
    In mozilla 1.0 and firefox, On clicking <input type=”image” name=”submit” value=”1″ src=”whatever”> the following fields are posted to the server

    submit.x=(x coordinate clicked on image)
    submit.y=(y coordinate clicked on image)
    submit=1

    Now I can’t seem to successfully test for the existence of submit.x in php (presumably cos of the “.”
    ………………………………..
    RESPONSE:
    I’ve done this many times. All I needed was this:

    <INPUT name=”submit” type=image src=”images/subbutton.jpg” width=”350″ height=”24″ border=”0″>

    if ($_POST['submit_x'])
    {
    ……………

    }

    So add “_x” to whatever the name of the image button. In your case, it’s also “submit_x
    ………………………………..
    RESPONSE 2:
    When you submit your form with a graphic button, you will notice the .x and .y appended to the name of the button.

    …snertal&crew%5B%5D=gosny&formbutton.x=37&formbutton.y=14

    But if you were to submit the page and look at the results, however, you’d see:

    formbutton_x = 37
    formbutton_y = 14

    Notice that the period (.) has been converted to an underscore (_). This may seem a little odd, but it’s necessary because variable names in PHP can’t have periods in them, so $formbutton.x would be an illegal variable name. In fact, any periods in form names — not just those for image buttons — are converted to underscores.