How do I detect which Form Input Type=image was pressed in JavaScript?

Question

This is my first post so be gentle. (I'm probably asking for trouble now!)

I have an HTML page with a form that has more than one 'image' type input for submitting. I've found out how to get a JavaScript validation function running using 'on submit' within the form declaration. But once in the java function I can't find a way to reference the image that I clicked on so I can detect which of the two it was.

Any help would appreciated.

Marc

Can you provide the HTML structure of the form element – nefarianblack Mar 02 '13 at 11:53 — nefarianblack, Mar 02 '13 at 11:53

score 1 · Accepted Answer · edited May 23 '17 at 11:49

1

If you need to do it on the server-side: I suppose it's same as in case of type=submit buttons. And there is a question about several submit buttons.

If you need to do it on the client-side: you can bind event handler (on event onclick) not on form, but on buttons themselves. Then you can refer to the clicked button inside handler as this. Alternatively (I'm not sure if it works), you can try to deal with event.target property.

edited May 23 '17 at 11:49

Community

1
1

answered Mar 02 '13 at 11:54

Artem Sobolev

5,891
1
22
40

Thanks. But it looks like the example in the link you gave me is in PHP rather than JavaScript, sorry to be fussy. Also, I don't know if the name and value attributes are available for image input types? It certainly didn't recognise them in my function. – Marc Brown Mar 02 '13 at 12:20
It seems I misunderstood you. I thought you need to recognize it on server side, since you're talking about Java (Java and JavaScript are **totally different** languages). I've edited my answer. – Artem Sobolev Mar 02 '13 at 12:39

score 0 · Answer 2 · answered Mar 02 '13 at 21:20

Thanks for your help B. In conjunction with your tip and looking at the related posts, I found the following code that worked a treat.

<script type="text/javascript">
var clicked;
function mysubmit() {
    alert(clicked);
}
</script>
<form action="" onsubmit="mysubmit();return false">
    <input type="submit" onclick="clicked='Save'" value="Save" />
    <input type="submit" onclick="clicked='Add'" value="Add" />
</form>

I then spent a long time wondering why my if..then..else wasn't working. It turned out to be because I used a capital E in 'else'!!! It's probably because I'm using Textpad instead of a proper debugger. I've been programming in VB for decades and never had so much trouble with syntax!

How do I detect which Form Input Type=image was pressed in JavaScript?

2 Answers2