Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Form): loses focus on submit #3796

Open
wants to merge 2 commits into
base: v3
Choose a base branch
from

Conversation

ivanmaxlogiudice
Copy link
Contributor

πŸ”— Linked issue

Resolves #3786

❓ Type of change

  • πŸ“– Documentation (updates to the documentation or readme)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • πŸ‘Œ Enhancement (improving an existing functionality)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

πŸ“š Description

When submitting a form, the loading state disables the inputs causing the lose of focus, so this save the activeElement before updating the loading status and restoring the focus at the end of submit.

I was between this solution and stop disabling the inputs on loading state.

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

Copy link

pkg-pr-new bot commented Apr 4, 2025

npm i https://pkg.pr.new/@nuxt/ui@3796

commit: c7b8b6c

@@ -231,6 +232,7 @@ async function onSubmitWrapper(payload: Event) {
emits('error', errorEvent)
} finally {
loading.value = false
setTimeout(() => activeElement?.focus(), 0)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not confortable with this setTimeout, I think we might be better off introducing a props like the button component loadingAuto to allow users to disable the automatic loading / disabled state.

@benjamincanac benjamincanac added the v3 #1289 label Apr 4, 2025
@ivanmaxlogiudice
Copy link
Contributor Author

I have added the loadingAuto prop, by default is true. I would prefer if its false btw

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
v3 #1289
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Input loses focus on failed submit
3 participants