question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cannot submit form when enter key down

See original GitHub issue
  • vue-autosuggest version: 2.0.0
  • node version: 10.15.0
  • npm (or yarn) version: 6.9.0

Relevant code or config


What you did: The form submit when [Enter] key down at input element on this component.

What happened: Key down event inhibite at this component key down event handler. Thus, the form submit was canceled.

Reproduction repository:

Problem description:

Suggested solution: If not affected, evaluate isOpen property in keydown event handler when captured at keycode 13.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
darrenjenningscommented, Jun 18, 2019

I see your problem now. You can do this: If a user hits enter @selected is emitted, and if no item is passed in, then you can submit the form. I updated the example:

https://codesandbox.io/s/httpsgithubcomdarrenjenningsvue-autosuggestissues125-sn74o

Let me know if that helps.

1reaction
darrenjenningscommented, Jun 17, 2019

You have to submit the form yourself, and this can be done in a number of ways:

<form ref="theForm">
<vue-autosuggest @keyup.enter="$refs.theForm.submit()"
<form @submit.prevent="submitHandler">
<vue-autosuggest @keyup.enter="submitHandler"

But you probably want to also check to see if the user selected an item and not always submit the form.

https://codesandbox.io/s/httpsgithubcomdarrenjenningsvue-autosuggestissues125-sn74o

Read more comments on GitHub >

github_iconTop Results From Across the Web

Prevent users from submitting a form by hitting Enter
The keydown event is preferred over keyup as the keyup is too late to block form submit. Historically there was also the keypress...
Read more >
Hitting enter not submitting my form! - Accessibility - SitePoint
Hi, when I hit enter on my site after hitting enter it's not submitting the form. Only clicking on login works.
Read more >
How to disable form submit on enter button using jQuery
How to disable form submit on enter button using jQuery ?
Read more >
The Enter Key should Submit Forms, Stop Suppressing it
One way to prevent this is to have the enter key do the submit ONLY when the button has the focus. Users with...
Read more >
How to Stop the Enter Key From Submitting the Form - WPForms
To disable this key on your forms, which include the submit button, next/previous page buttons as well as using the enter key to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found