search

IgniteUI / igniteui-angular

Ignite UI for Angular is a complete library of Angular-native, Material-based Angular UI components with the fastest grids and charts, Pivot Grid, Dock Manager, Hierarchical Grid, and more.
https://www.infragistics.com/products/ignite-ui-angular
Other
571 stars 160 forks source link

Autocomplete.close reopenes the drop down #7508

Closed Eralmidia closed 4 years ago

Eralmidia commented 4 years ago

Description

It seems like the close method for the auto completes opens the drop down before closing it again.

Steps to reproduce

  1. Call the close method on an already closed autocomplete

Result

When calling close on a closed autocomplete, the dropdown flashes for a show moment.

Expected result

Calling close on a closed autocomplete should ignore the command.

wnvko commented 4 years ago

I am not able to reproduce this here I've tested this in Google Chrome, MS Edge, Mozilla Firefox and Opera browsers. @Eralmidia can you share a sample showing this issue?

Eralmidia commented 4 years ago

Hi Milko

The issue can be illustrated when I do something like this: https://stackblitz.com/edit/angular-3vm5bm?file=src%2Fapp%2Fautocomplete%2Fautocomplete.component.ts

This is a modified version of the sample on the docs page. The only diffence is that I automtically close the dropdown on any key event. As you can see, the box shadow of the drop down will flash for each character, even if there are no matches.

What I'm trying to achieve, is that the autocompete should not be active before a certain number of characters. So if the user has only inputed 1 or 2 characters, the auto complete should remain closed.

wnvko commented 4 years ago

Hi @Eralmidia , To prevent opening of the autocomplete drop down you may handle onOpening event of the drop down itself. Please check this Stack Blitz. Here the drop down does not show until three characters are entered in the input.

Eralmidia commented 4 years ago

Neat, I'll give that a go then. Thanks for the assistance 👍