user818700
user818700

Reputation:

Img acting as button in HTML form submitting when it shouldn't

I have a simple image inside an HTML form that acts as a button. When a normal button is clicked I act upon that using the onClick attribute, but with my images when you click on them the onClick does work, but the image also submits the form, when it actually shouldn't.

My code:

<input type="image" id="button" value="Assign" src="/Images/rightarrow.png" alt="Assign Selected Rule" class="imgAssignUnassign" onclick="manageHandlers('Assign')" />

Any help with this would be greatly appreciated!

Upvotes: 0

Views: 316

Answers (3)

Andy Pieters
Andy Pieters

Reputation: 343

It's because you are using <input type='image' /> If you just want a normal image use the <img /> tag

Upvotes: 0

bjornd
bjornd

Reputation: 22943

You're wrong. It should according to w3c docs.

To prevent that you could user preventDefault method of the event:

$('#button').click(function(e){
    //do something
    e.preventDefault();
});

Upvotes: 0

mowwwalker
mowwwalker

Reputation: 17362

Specifying the type attribute of an input as image makes it a submit button. Add return false to the onclick.

<input type="image" id="button" value="Assign" src="/Images/rightarrow.png" alt="Assign Selected Rule" class="imgAssignUnassign" onclick="manageHandlers('Assign');return false" />

Upvotes: 4

Related Questions