Advanced Select multiple not storing multiple selected values correctly

[connormccarl]

Summary

The Advanced Select multiple is not storing multiple selected values correctly

Steps to Reproduce

1. Start up a Nextjs project with Preline package installed
2. Paste in the example code for Advanced Select multiple: https://preline.co/docs/advanced-select.html#multiple
3. Print out stored values using your preferred method (I have tested using a form with react-hook-form and separately with controlled components using e.target.selectedOptions)

You will notice that if one option is selected then the stored value array populates with that one value. If multiple values are selected, the stored value array is empty.

When I remove the preline "data-hs-select" property, the html multiple select attribute works as intended, storing all of the selected values in an array.

Values from a html multiple select element are in e.target.selectedOptions. There seems to a bug in preline code that does not add to this array correctly when more than one option is selected.

---

IN THE DEMO

I recreated the issue. After each option selection, the stored values print out in an alert. You will see clearly that when one value is selected the value is stored correctly, but there is an null array when multiple values are selected.

---

Versions
Next: 14.2.3
Preline: 2.3.0
React: 18
Tailwind CSS: 3.4.1

Demo Link

https://stackblitz.com/edit/stackblitz-starters-uofooa?file=app%2Fpage.tsx

Expected Behavior

On multiple selected values, they are stored correctly in an array.

Actual Behavior

On multiple selected values, a null array is stored.

Screenshots

https://drive.google.com/drive/folders/1UqJOXks7nCG0Y60eyTBzisdk_v1b8Lq4?usp=sharing

[oliverhaas]

This is apparently fixed in 2.4.1, i.e. using the newest preline version in the provided demo works.

[jahaganiev]

Hey @connormccarl - please check out the latest version, the issue has been fixed. Thanks!