Page 1 of 1

Images as submit buttons

Posted: Sun Jan 16, 2005 3:48 pm
by Paddy
Hey guys, I have come across a particular problem that I can not find a solution for in google. I am wondering if someone may have some sample code for me.

My problem is that I have a form with multiple submit buttons. These are images that require mouseovers. I tried using type="image" in the input tags but I could not get mouseovers to work. I also tried using onclick="submit();" in an img tag but then I could not differentiate between the multiple submits.

I feel like I am banging my head against the wall. I know the solution must be simple and I would appreciate any help to get me pass this.

Posted: Sun Jan 16, 2005 3:59 pm
by JAM
You could...

Code: Select all

<form method="post">
<input type="image" src="image.gif" name="a" value="Submit" />
<input type="image" src="image.gif" name="b" value="Submit" />
<input type="image" src="image.gif" name="c" value="Submit" />
</form>
<?php
    if (!empty($_POST)) &#123;
        $newarray = array_flip($_POST);
        echo $newarray&#1111;'Submit'];
    &#125;
?>
Not sure this is "the" way tho... I flip the array, so note that you need to flip it once again to get the results as-is.

Posted: Sun Jan 16, 2005 4:16 pm
by Paddy
My problem with that is that mouseovers do not work. I need the image to change when hovered.

Posted: Sun Jan 16, 2005 5:01 pm
by JAM

Code: Select all

<input onmouseover="this.src='dossier2.gif'" alt="Hover Button" onmouseout="this.src='dossier.gif'" type="image" src="dossier.gif" name="a" value="Submit" />
...works here...
Moving this thread to client side...

Posted: Sun Jan 16, 2005 6:14 pm
by Paddy
It seems it was the way I was doing mouse overs. Interesting that it works with anchor tags but not input ones. Ah well, works now.

Thanks a bunch Jam. :)

Posted: Sun Jan 16, 2005 8:19 pm
by Paddy
Just another question. I found I could not compare the name of the input to the value of the input. So doing

Code: Select all

$a = (isset($_POST&#1111;'a'])?$_POST&#1111;'a']:"");
if ($a == "Submit")&#123;&#125;
always fails. I found an article that stated the form only posts the x and y coordinates of the click. So doing

Code: Select all

if ($_POST&#1111;'a_x'] != "")&#123;&#125;
will perform the test. The article can be found here.

http://builder.com.com/5100-6371-5242116-3.html

Is this the best/only way to do this?

...

Posted: Mon Jan 17, 2005 6:58 am
by Calimero
Don't know in php but,

Have you tried in JavaScript to add the name(s) of the fields and pass them as a variable ( there are numerous ways ) so then php can process them.


For submit-ing I would do this:

Code: Select all

<script language="Javascript">

Function go_baby(a)
&#123;
document.form_name.action = a;
document.form_name.submit();

&#125;

</script>

And those little buttons: onClick="javascript:go_baby(parameter_A)"


Parameter A - action: page to where the form should be submitted.

ex. onClick="javascript:go_baby('process_page.php');"

Parameter A - use unique parameter for each button ( image ) and in that way the form will be submited where you want.



Hope this helps.

Posted: Mon Jan 17, 2005 6:52 pm
by Paddy
Hmmm...I really don't like js all that much. I will keep that in mind though. I do like the idea of the ability to send to different pages. This will go in my code library.

Cheers. :)

Posted: Tue Jan 18, 2005 2:12 am
by timvw
i think that a browser will add something to your original name....

so using <input type='image' name='foo'> will give you $_POST['foo_x']
but you have already read that ;)


afaik it is the only way....

Posted: Tue Jan 18, 2005 9:43 pm
by Paddy
For those who don't know $_POST['somevar_y'] will give the y coordinate. I guess it is a way to do image maps to the same action without GET.