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.

Set autofocus when we have a selected item

See original GitHub issue

This is not so much an issue as a feature request, but could be considered both ways

Lets say we setup an auto-complete like this:

Steps to reproduce and a minimal demo

 <input  ngui-auto-complete
                   [formControl]="continent"
                   [source]="continents"
                   [list-formatter]="autocompleListFormatter"
                   value-property-name="id"
                   display-property-name="name"
                   placeholder="Contients"
                   class="form-control"
                   tab-to-select="true"
                   (keyup.enter)="search()">

http://plnkr.co/edit/ezq5Q6?p=preview

Current behavior

So the user should be able to navigate comfortably without using the mouse to select nor to execute onClick functions, but the issue here is that the input box doesn’t have focus, not on mouse selection, not on tab selection, it actually moves on to the next UI item when hitting tab (it does its job by selecting the appropriate item, but focus jumps on to next item)

Expected/desired behavior

It would be ideal to have the focus stay on the input element all the time the user has selected an item, via mouse click &/0r enter, it would be much more user-friendly and intuitive

Issue Analytics

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

github_iconTop GitHub Comments

1reaction
allenhwkimcommented, Sep 11, 2017

I have made change and released, plz check.

0reactions
Soadfancommented, Jan 7, 2019

Hey ! is it possible to publish the new versions on npmjs please? https://www.npmjs.com/package/ng2-auto-complete Last one is version 12.

We are on angular 4 so if it’s possible to publish not only the most recent ones but also the others, it would be kind.

Thanks in advance.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How do I set autofocus to an input that's inside a select ...
Try to use ref={(input) => input && input.focus()} in combination ... const { Option } = Select; let index = 0; class App...
Read more >
HTML select autofocus Attribute - W3Schools
The autofocus attribute is a boolean attribute. When present, it specifies that the drop-down list should automatically get focus when the page loads....
Read more >
Set Input Focus with HTML5 autofocus | SamanthaMing.com
Use the autofocus attribute on form elements to automatically focus the input field when the page loads This is super handy if your...
Read more >
autofocus - HTML: HyperText Markup Language | MDN
The autofocus global attribute is a Boolean attribute indicating that an element should be focused on page load, or when the <dialog> that...
Read more >
3 ways to autofocus an input in React that ALMOST always work!
If you don't want to use the autofocus attribute (which I hope you don't, at this point ), there is a more imperative...
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