Selective Submission of form using <button> tag not working

I want a function to take some values from a form as input and manipulate in the background . I tried but it goes to a url mydomain.com/gtype=selected value . I just want it to do something in the background a开发者_开发技巧nd not change the url

I have a fiddle over here. http://jsfiddle.net/4qppX/

You need to return false in your onclick handler.

<button onclick="hihi(this.form.gtype); return false">sub</button>

An alternative is to make the button a non-submitting button by saying type="button"

<button type="button" onclick="hihi(this.form.gtype);">sub</button>

I am not sure about the reasoning for this by the W3C states:

If the element has a form owner, the element must submit the form owner from the button element.

You can also make sure your button is just a button, and not a "submit" control:

<button type='button' onclick='hihi(this.form.gtype)'>sub</button>