ngx-chips icon indicating copy to clipboard operation
ngx-chips copied to clipboard

focusFirstElement attribute on TagInputDropdownComponent does not focus on first item

Open jfknoepfli opened this issue 6 years ago • 4 comments

PLEASE MAKE SURE THAT:

  • you searched similar issues online (9/10 issues in this repo are solved by googling, so please...do it)
  • you provide an online demo I can see without having to replicate your environment
  • you help me by debugging your issue, and if you can't, do go on filling out this form

I'm submitting a ... (check one with "x")

[ x] bug report => search github for a similar issue or PR before submitting
[ ] support request/question

Notice: feature requests will be ignored, submit a PR if you'd like

Current behavior When attribute focusFirstElement="true" is set on TagInputDropdownComponent and when looking for a tag coming from an autocomplete component, the first element in the dropdown list IS NOT focused.

Expected behavior When attribute focusFirstElement="true" is set on TagInputDropdownComponent and when looking for a tag coming from an autocomplete component, the first element in the dropdown list IS focused.

Minimal reproduction of the problem with instructions (if applicable)

  • Clone the repo from master at commit eb8531a0e7822ca81b94095626468458da24cd6c
  • Launch the demo application (cd demo/home; npm install; npm start and then open the localhost URL provided by the start command)
  • On the demo page, go to "Tags within an autocomplete component (clear on blur events)" that has focusFirstElement="true" attribute in the html file.
  • Remove all the tags
  • Type char "i"
  • Javascript and Typescript items are displayed.

None of them is focused.

What do you use to build your app?. Please specify the version angular-cli

Angular version: 6.1.7

ngx-chips version: 1.9.7+ (master code eb8531a0e7822ca81b94095626468458da24cd6c)

Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ] Fedora 28 :

  • Firefox 61.0.2 (64-bit)
  • Chrome 68.0.3440.106 (Official Build) (64-bit)

jfknoepfli avatar Sep 12 '18 19:09 jfknoepfli

+1

zsoflin avatar Sep 19 '18 21:09 zsoflin

+1

bartholomej avatar Apr 29 '19 13:04 bartholomej

@Gbuomprisco We have found out that if you write something, focus-out and focus-in, first item is selected.

After examination we have found out that ng2-material-dropdown loads the items from ng2-menu-item elements. These items are on first focus empty. This means that here https://github.com/Gbuomprisco/ngx-chips/blob/e91dd8d89d91c98d454de89c09b7156c1e538018/modules/components/dropdown/tag-input-dropdown.template.html#L6 the items variable must be empty in the time of first focus-in.

Don't know why, maybe this will help.

luki215 avatar Apr 30 '19 10:04 luki215

+1

zhuweid avatar Feb 21 '21 03:02 zhuweid