How come the first


Tags: javascript,html,css,forms

Problem :

I have a <form> Inside that form, I have 2 submit buttons.

The first one is this:

<button  class="regular" id="geocodesubmit" style="height:40px;">Set Loc
ation</button>

The second one is this:

<button  type="submit" class="regular" name="Submit Discovery">Submit</button>

How come my first button gets activated when I push enter on one of the text boxes? I want the 2nd one to activate...

I don't want the first one to respond to any keypresses.

Note: I don't want to use input type="submit", because I have a lot of other css stuff.



Solution :

The HTML4 spec says that the default type of a button tag is submit.
See: http://www.w3.org/TR/html401/interact/forms.html#h-17.5

So your problem is simply the fact, that your first button doesn't have a type attribute and will therefore act like another submit button.

To fix it set type="button" for the first button.


    CSS Howto..

    How can i get my slideshow to stop changing size?

    How to make div expand only from bottom down

    Displaying the first in simple Show / Hide content menu with active a

    How do I display content in a way like UICollectionView on the web?

    How to “float” an absolutely positioned element div out of its container

    how to change css of n number of div element using jquery

    How to get minimal jQuery slideshow to slide properly?

    How to center a block of social icon background images?

    How to set an Ionic list item height with a background image

    How do I get this HTML canvas animation to appear on top of my image?

    How to give border to any element using css without adding border-width to the whole width of element?

    CSS Flexbox: How do you align child elements of a flexbox container to opposite far ends of the main axis?

    How to Convert RGB to HEX ( for Gradients )

    how to position these CSS elements without defining height and width

    how to center image + text in an li Element

    Cannot get Font Awesome Images to Show

    How to use Javascript to check and load CSS if not loaded?

    How to create a header that changes as you scroll down the page? [duplicate]

    CSS: how to vertically and horizontally align an image?

    How to make the float left and float right on the same line?

    How to disable custom animations from click, angular?

    How to apply a responsive CSS height to an element using min/max-height and height?

    How do I stop the FLOAT (without extra markup)?

    How can i make 3 independently scrollable columns

    How can I make clickable list with sublinks ?

    How to make first page fullscreen and others not [closed]

    hide/show multiple div elements using jquery

    How to set overlay on a page according to page height using CSS

    how to make my horizontal css dock navigation to vertical

    How Do I Use Gulp to Minify and Autoprefix CSS files from SASS/SCSS