Button type “button” vs. “submit” [duplicate]

by

From MDN:

type
The type of the button. Possible values are:

  • submit: The button submits the form data to the server. This is the default if the attribute is not specified, or if the attribute is dynamically changed to an empty or invalid value.
  • reset: The button resets all the controls to their initial values.
  • button: The button has no default behavior. It can have client-side scripts associated with the element’s events, which are triggered when the events occur.

As for the difference between button and input:

  • A button can have a separate value as data, while for an input the data and button text are always the same:

    <input type="button" value="Button Text"> <!-- Form data will be "Button Text" -->
<button type="button" value="Data">Button Text</button>

  • A button can have HTML content (e.g. images), while an input can only have text.

  • A button may be easier to tell apart from other input controls (like text fields) in CSS. Note backwards browser compatibility.

    input {

}
button { /* Always works */

}
input[type=button] { /* Not supported in IE < 7 */

}

More Related Contents:

  1. vs. . Which to use?
  2. HTML input – name vs. id [duplicate]
  3. Get the value in an input text box
  4. What’s the proper value for a checked attribute of an HTML checkbox?
  5. Disable Auto Zoom in Input “Text” tag – Safari on iPhone
  6. Why is HTML5 input type datetime removed from browsers already supporting it?
  7. How to set default value to the input[type=”date”] [duplicate]
  8. how to POST/Submit an Input Checkbox that is disabled?
  9. Input type DateTime – Value format?
  10. How to add button inside input [closed]
  11. HTML5 Email input pattern attribute
  12. Bootstrap 3 – How to maximize input width inside navbar
  13. What is the max number of files to select in an HTML5 [multiple] file input?
  14. What characters are allowed in the HTML Name attribute inside input tag?
  15. How to align texts inside of an input?
  16. HTML: Characters allowed for name attribute of input element?
  17. How to add button inside an input [closed]
  18. Thymeleaf – How to add checked attribute to input conditionally
  19. How do I make a text input non-editable?
  20. Drop Down Menu/Text Field in one
  21. Trouble with image
  22. vs vs for inline and block code snippets
  23. HTML: Is it possible to have a FORM tag in each TABLE ROW in a XHTML valid way?
  24. Html form in email
  25. How To Auto-Format / Indent XML/HTML in Notepad++
  26. How to change the color of Element depending on its height or width?
  27. How do you create a hidden div that doesn’t create a line break or horizontal space?
  28. Get content between a pair of HTML tags using Bash
  29. What can be other ways than @media to make a website responsive suitably if I don’t mention target resolution? [closed]
  30. An URL to a Windows shared folder [duplicate]

Leave a Comment