htmlstreamofficial / preline

Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.
https://preline.co
Other
4.58k stars 287 forks source link

Click on data-remove not firing any event on Advanced Select #420

Open jorgegonzalezpiedra opened 1 month ago

jorgegonzalezpiedra commented 1 month ago

Summary

When clicking the data-remove item "x" in advanced select the change event is not fired.

Steps to Reproduce

  1. Create a advanced select with multiple input
  2. Add a "onChange" event with a console.log showing values
  3. Select a a value, see hoe the console shows the log with the values
  4. Click on the "x" to remove the item, see how the log shows nothing screen-capture (1).webm

Demo Link

screen-capture (1).webm

Expected Behavior

When clicking "x" the item is removed

Actual Behavior

When clicking "x" the item is NOT removed

Screenshots

[When clicking "x" the item is removed]screen-capture (1).webm

oliverhaas commented 1 month ago

I can confirm that removing with the "x" is not firing the change event, since it is removed from the select via javascript, and javascript value updates do not trigger change events by default. However, the Advanced Select should behave like a normal select would imo, so I'm agreeing with you.

Your wording is not ideal however, since the selection actually is removed from the select. So if you submit a form, it works as expected.

A simple workaround is to just add an event listener on click and dispatch a change event yourself.