brainlid

brainlid

Phoenix 1.7.0 brings a lot of new things when we run mix phx.gen my_app. These new and cool ways of doing things aren’t automatically brought to existing projects because they come from the generators. Of the many new things we could bring to an existing project, we focus on the new approach to form input components. Why? Because it’s both cool and useful! This post builds a custom multi-select checkbox group input for selecting which tags to associate with a database record in our Phoenix application. It’s surprisingly easy and elegant!

Showing Posts 1 to 3

LostKobrakai

LostKobrakai

I recently build something like this as well: https://kobrakai.de/scratchpad/checkboxes

One problem, which I didn’t see discussed in the blog post is that you cannot submit an empty list due to how inputs are serialized in html. So no way to unselect everything and have it save properly. I do have one workaround to that in my code, but there are a few ones with different tradeoffs.

brainlid

brainlid OP

Good catch! Thanks for bringing that to my attention!

brainlid

brainlid OP

I updated the article to support dealing with an empty list. This lets you assign tags and then remove all the tags.

Updates:

  • Tagging post - updated schema changeset functions to remove blank entries. Used by the UI.
  • This article - added a hidden input to always send a value. In this case, it sends "". The blank value is removed during processing. This is the fix.
  • gist - The gist was updated for the fix. Added the separate ChangesetHelpers file for a more complete solution in the gist.
— All posts loaded —

Where Next? Top

Trending in Blog Posts Top

mudasobwa
I am seeing a lot of aplications of Argumentum ad Vericundiam in software discussions. They do link some piece of writing and point us to...
New
rhcarvalho
At the heart of every Phoenix application is the often “invisible” HTTP server layer. For over a decade Cowboy has served the community ...
New
zorn
I wrote up a blog post talking about the first skill I made, one that does a detailed Elixir dependency update. More than Dependabot, it...
New
pckrishnadas88
I’ve published Part 4 of my Elixir distributed systems learning series. This part explores process linking using low-level primitives di...
New
pckrishnadas88
Hey everyone! :waving_hand: I’ve published Part 7 of the Building Distributed Systems in Elixir series, where we build core distributed ...
New
mudasobwa
So, instead of wasting my afternoon arguing with anonymous handles on X, I turned to my trusty, soulless assistant and said: “Listen, ple...
New
abreujp
New article: Elixir Project Structure — From mix new to a Growing Codebase I’ve published a new article in my Elixir learning series on d...
New

Other Trending Topics Top

mudasobwa
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
New
garrison
Hobbes is a low-level distributed database for the Elixir programming language. Hobbes provides a simple, safe, and scalable storage lay...
New
marciok
Hi there! We created Gust: A task orchestrator inspired by Airflow. For those who have never heard about Aiflow, it’s a Python-based wor...
New
jimsynz
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
Damirados
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge & Solve. They are GUI (Emerge) and State management (S...
New
netoum
Corex is an accessible, unstyled UI component library for Phoenix that integrates Zag.js state machines using Vanilla JavaScript and Live...
New

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews