I have a form with an image button inside of it, and this image button is submitting the form. How do I override this functionality?
<form><input type="image" src="/images/arrow.png" id="imageButton" onClick="javascript:autofill();"/></form>
The default value for the type attribute of button elements is "submit". Set it to type="button" to produce a button that doesn't submit the form. In the words of the HTML Standard: "Does nothing."
The simplest solution to prevent the form submission is to return false on submit event handler defined using the onsubmit property in the HTML <form> element.
As someone already mentioned, if you switch the form to a post method and switch the Servlet to a doPost, you won't have this issue anymore. You can check if the user clicked the back button, disable form if true. Another way is by storing a cookie which you check on page load, if it exists you can disable the form.
Definition and UsageThe <input type="image"> defines an image as a submit button. The path to the image is specified in the src attribute.
Why use an input element at all? I'd have thought just using an image with an onclick event would be more appropriate if you don't want to cause any submit or reset behaviour
<image src="/images/arrow.png" onclick="javascript:autofill();" width="xxx" height="xxx" alt="Autofill" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With