Semantic-ui: Single dropdown selection does not work when clicking an item and having 'select' action (version 2.2.1)

[dorsha]

Installed version: 2.2.1

I have the following dropdown configuration:

      dropdownSelector
          .dropdown({
            fullTextSearch: true,
            preserveHTML: true,
            onChange,
            action: 'select',
            onHide: this.onHide,
            onShow: this.onShow,
            transition
          });

I am using the 'select' action since I don't want the current text to be changed.

Prior version 2.2.x, it works fine.
After the upgrade, the 'onChange' is not dispatched when clicking the dropdown item - but, it dispatched when moving around with the keyboard arrow keys.

I also tried to add allowReselection: true but it did not fix it.

Any idea?

Clicking the item is not doing anything, but moving around with the keyboard works.

When I remove the 'select' action it works, but it changed the selected text.

[jlukic]

Can you create a JSFiddle?

There were significant dropdown changes and I want to make sure everything is fine.

[dorsha]

Yes.

Semantic-UI 2.1.8:
https://jsfiddle.net/no7kfus9/
Clicking on the dropdown's items works fine (you get an alert).

Semantic-UI 2.2.1:
https://jsfiddle.net/rgdb931n/
Clicking on the dropdown's items does not trigger the onChange event (you don't get alert).
The onChange it triggered when you try to navigate with the keyboard arrows keys. (in the previous version, navigate with the keyboard keys was not triggered the onChange event)

Ignore the bad style :)

[yaowenz]

I've got the same issue on 2.2.1

[assafg]

Any updates on this issue?

[Kukkimonsuta]

The 'onChange' trigger on keyboard arrows keys seem to be intended change and you can disable it by setting new option selectOnKeydown to false. This however still doesn't change the fact, that onChange doesn't trigger on either click or enter when action == 'select'.

Semantic-UI 2.2.1
https://jsfiddle.net/y2vq2u8m/1/

[dorsha]

@jlukic, any update regarding this issue?
It's blocking us for upgrading to Semantic-UI 2.2.x

[jlukic]

Working on this now.

[jlukic]

I've fixed this for next patch release.

[martinduparc]

The issue still seems to be present in 2.2.4:

http://jsbin.com/gaqewihaha/edit?html,js,output

Here is my PR: https://github.com/Semantic-Org/Semantic-UI/pull/4510

[dorsha]

@martinduparc try this one: http://jsbin.com/zitasehexi/edit?html,js,output
It works as expect... value, text and selectedItem are defined (and you can see the selected elements).

[martinduparc]

Thanks @dorsha but this isn't the behavior I am expected. The dropdown you used is multiple and I need the action to be select to retain the current text.

[dorsha]

@martinduparc
So just remove the multiple attribute:

http://jsbin.com/huyazequnu/1/edit?html,js,output

Seems to work (single select + correct values are printed):

[martinduparc]

@dorsha Works well without the select action but doesn't when the option is set:
http://jsbin.com/dokigupawu/edit?html,js,output

[dorsha]

Yes, because when having the select option, the the dropdown does not change the current text.

From their documentation:
http://semantic-ui.com/modules/dropdown.html#/settings

It is more likely to use the select option when you don't want the text to be changed, like in the following dropdown:

[martinduparc]

The behavior must have changed then since $selectedItem was working in v2.1. The documentation still states the following onChange(value, text, $choice) so it might be outdated?