Skip to content

Linter Rule: Prefer data-turbo-submits-with over the deprecated data-disable-with

Rule: ujs-prefer-turbo-submits-with

Description

Disallow the data-disable-with attribute and the Action View helper option that renders it, data: { disable_with: ... }. Use data-turbo-submits-with or data: { turbo_submits_with: ... } instead.

Rationale

Before Rails 7, Rails shipped @rails/ujs by default, which added JavaScript behavior to elements through helper options and data-* attributes. Rails 7 stopped including it, and Turbo covers the same behavior with its own attributes.

data-disable-with made @rails/ujs disable the submit button and swap its label for the given text while the request was in flight, which is what stopped users from double submitting a form. data-turbo-submits-with is a drop-in replacement, so the migration is mechanical.

Once @rails/ujs is gone the attribute is inert, and the failure is silent rather than loud: the form still submits, but the button stays live and keeps its original label. Double submissions become possible again on exactly the forms that were annotated to prevent them.

Examples

✅ Good

erb
<button data-turbo-submits-with="Saving...">Save</button>
erb
<%= f.submit "Save", data: { turbo_submits_with: "Saving..." } %>
erb
<%= submit_tag "Save", data: { turbo_submits_with: "Saving..." } %>

🚫 Bad

erb
<button data-disable-with="Saving...">Save</button>
Avoid the deprecated `@rails/ujs` attribute `data-disable-with`. Use `data-turbo-submits-with` instead. (ujs-prefer-turbo-submits-with)
erb
<%= f.submit "Save", data: { disable_with: "Saving..." } %>
Avoid the deprecated `@rails/ujs` option, which renders `data-disable-with`. Use `data: { turbo_submits_with: ... }` instead. (ujs-prefer-turbo-submits-with)
erb
<%= submit_tag "Save", data: { disable_with: "Saving..." } %>
Avoid the deprecated `@rails/ujs` option, which renders `data-disable-with`. Use `data: { turbo_submits_with: ... }` instead. (ujs-prefer-turbo-submits-with)

References

Released under the MIT License.