Pressing enter should open the dropdown when ng-select is focused

[SandeepThomas]

Expected behaviour

Pressing the enter key when ng-select is focused should open the dropdown if its closed like native select.

Actual behaviour

Pressing the enter key when ng-select is focused does nothing if its closed.

More Info

ng-select version: 1.3.0

browser: Chrome

reproducible in demo page: YES

[varnastadeus]

@SandeepThomas it only opens on windows so this behaviour isn't consistent among other OS's

[SandeepThomas]

@varnastadeus yes, but is it possible to make it open the dropdown on enter key?

[varnastadeus]

ofcourse it is, but you need to handle it yourself.

[SandeepThomas]

can you please guide on how to achieve that? i tried attaching a keyup event listener to open the dropdown if its closed, but that opens the dropdown after selecting a value also.

[varnastadeus]

@SandeepThomas

<ng-select [items]="people$ | async"
    bindLabel="name"
    #select 
    bindValue="id"
    (keydown.enter)="$event.stopImmediatePropagation(); select.toggle()"
    [(ngModel)]="selectedPersonId">
</ng-select>

here is an idea, ideally if select is open you need to to do nothing and if it is closed call open method.

[SandeepThomas]

Thanks, will try that tomorrow and post here the result.

[varnastadeus]

Also we will consider making it as a feature.

[SandeepThomas]

Thanks @varnastadeus. I tried it in stackblitz and it seems to be working, will try in my original code tomorrow.

Here is the link if any one is interested: https://stackblitz.com/edit/ng-select-example-3nwrql

It also has option to change language dynamically without breaking search and highlight.

[varnastadeus]

@SandeepThomas I made change in our codebase.

[SandeepThomas]

Oh, I see. Thanks buddy 👍

[SandeepThomas]

@varnastadeus i tried it in my project, but its triggering search while pressing enter!

[varnastadeus]

can you add reproducible example? I don't see it happen in demo page.

[SandeepThomas]

Sorry, my bad. Its something to do with my code.

[SandeepThomas]

@varnastadeus you can see my issue here: https://stackblitz.com/edit/ng-select-example-jl5swq

Am changing the focus to another input on dropdown value change, but its triggering the keydown.enter in the new input.

My use case involves a Phone Number input with ng-select to select country code and an input field to enter mobile number. So when a user selects a country code, i need to set focus automatically on the number field so that user can just enter the number and press enter to submit the form.

[varnastadeus]

use (keydown.enter). While focusing to input, input still catches keyup event and triggers your logic. Or you could use timeout.

[dreamid27]

@varnastadeus Love your support, thank buddy.

this is why i'm use ng-select !

[peca021]

I have updated angular from version 7 to 8 and now the stopImmediatePropagation() method on (keydown.enter) event is not working anymore. :/

Does anybody know how to prevent selecting the marked option on the enter key if the select's dropdown is closed?

In my project I use:
Angular: 8.2.14
Typescript: 3.7.3
ng-select: 3.7.0

Thanks in advance!

[peca021]

@varnastadeus, @dreamid27, @SandeepThomas guys can anybody help me?