About the HTML Submit Input Generator
Two elements can submit a form. An input with type="submit" takes its visible text from the value attribute and cannot contain anything else, while a button with type="submit" holds real markup, so it can carry an icon, a spinner or a line of small print next to the words. This builder writes either, and the type is always spelled out, because a button with no type inside a form defaults to submit and quietly breaks scripts that expected a plain click handler.
The formaction attribute is the useful trick here. Put a second submit button in the same form with a different formaction and you get save and publish, or save and preview, with no JavaScript at all. Give each button a name and the server can also tell which one was pressed, since only the activated submit control sends its value along with the rest of the fields.
Resist disabling the button until the form looks valid. People are left with a dead control and no explanation of what is missing, which is worse than letting the submit happen and showing the errors. The optional stylesheet includes hover and disabled states so the control never looks broken while a request is in flight. For a richer set of shapes and shadows, see the CSS Button Generator.
How to use
- Choose button when you need markup inside, or input for a plain caption.
- Set the wording, and add a name if the server needs to know which button fired.
- Add a formaction to send this button to a different endpoint.
- Copy the control, with the stylesheet if you want the hover and disabled states.
Common questions
- button or input type submit?
- Use button when you want markup inside it, such as an icon. Use input when a plain text caption is all you need.
- Why set the type explicitly?
- A button inside a form submits by default, so leaving the type off makes ordinary click handlers reload the page.
- What does formaction do?
- It overrides the form action for that one button, which is how a single form gets separate save and publish endpoints.
- Does a disabled button submit anything?
- No. A disabled control is skipped by the browser and its name and value never reach the server.