Skip to content

Commit

Permalink
Change form template to use button tag
Browse files Browse the repository at this point in the history
Rails 7 uses Turbo/Stimulus by default. Turbo adds disabled attributes
when submitting form (see hotwired/turbo#386).
As the PR describes, we can change submission text when form is
submitted.

```
button                  .show-when-disabled { display: none; }
button[disabled]        .show-when-disabled { display: initial; }

button                  .show-when-enabled { display: initial; }
button[disabled]        .show-when-enabled { display: none; }
```

```
<button>
  <span class="show-when-enabled">Submit</span>
  <span class="show-when-disabled">Submitting...</span>
</button>
```

This is only possible with the button tag. Because input tag does not
allow child elements.

It also seems like that button tags are preferred way nowadays.

> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/button
> Note: While <input> elements of type button are still perfectly valid
> HTML, the newer <button> element is now the favored way to create
> buttons. Given that a <button>'s label text is inserted between the
> opening and closing tags, you can include HTML in the label, even
> images.
  • Loading branch information
shouichi committed Jul 11, 2023
1 parent 66676ce commit 9957eae
Showing 1 changed file with 1 addition and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,6 @@

<% end -%>
<div>
<%%= form.submit %>
<%%= form.button %>
</div>
<%% end %>

0 comments on commit 9957eae

Please sign in to comment.