ntd23
PhoenixSelect2 is a LiveComponent to facilitate the use of multi select with search. Normally I use Select2 to make a multiselect that has search and can add and remove items, but I was bothered by the need to always use hooks and have a lot of interaction with direct JS to handle the events. So, this library is basically a copy (literally in the case of the CSS used) of this library in react, but the whole flow of adding, removing and searching the options was done using LiveView.
Two important points of this library are that:
- It has a hint of Alpine to perform some transitions and hide the selection bar.
- I still haven’t learned how to test
live_components
In the second case help and suggestions are welcome! In the first case I would need to use newer versions of LiveView in order to replace the use of alpine with phx-clickaway, which won’t be possible since I want to support older versions.
PS: is not production ready!!!
Where Next?
Trending in Announcing
Other Trending Topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Bringing learning, work and compliance together since 1987.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #library
- #deployment
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #podcasts
- #javascript
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixirconf-us
- #blog-post
- #ai
- #elixir-ls
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #hex
- #security
- #metaprogramming
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!
Producing high quality Elixir screencasts since 2017.
**Building the future of software with AI, trust, and human connection.**
The deployment platform built for Elixir: PaaS ease, VPS control.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"
Showing Posts 1 to 1- Show Best Posts
- Show All (oldest first)
- Show All (newest first)
cmo
You can create a simple liveview in your test that contains the component and test that.