marcandre

marcandre

Add `phx-input` binding to LiveView

I notice that most events have bindings (e.g. phx-keyup) but not the input event.

The input event is the preferred way to interact with an input. For a text input, the keyup and input events will typically correspond, but not always. Example: pressing arrow keys, or command-A triggers keyup but no input. Selecting the “Cut” or “Paste” menu items will generate an input even but no keyup.

Most Liked

chrismccord

chrismccord

Creator of Phoenix

phx-change on a form or input is effectively the input listener. (We literally bind to "input"), so phx-change should give you what you want.

LostKobrakai

LostKobrakai

Does phx-change work?

marcandre

marcandre

No, input is triggered for every changes, before they are “committed”, while change is triggered when it’s committed (e.g. you tab out the text field). That’s why I compared it to keyup; you might get a bunch of keyup before there’s a change event.
Another example, the color input presents a modal with a color wheel. It triggers input events whenever you select a color, and change only when you click on “ok”.

Where Next?

Popular in Proposals: Ideas Top

virinchi_cv
The Problem Phoenix 1.8 comes aggressively coupled with Daisy UI, a decision which many developers in the community have had mixed feelin...
New
andypearson
Hey all, I have been working on some performance improvements for the Phoenix application I work on. As part of this, through trial and...
New
lessless
Hi, There are a few writeups describing alternative config arrangements by a topic (or an OTP app): Configuring Phoenix apps: Two sma...
New
AHBruns
So, LiveView 0.20 brought an async processing API which is a thin wrapper around tasks. It’s a very nice convenience, but the main thing ...
New
jakeprem
Goal: To make JS.patch and JS.navigate more interoperable with JS.push. Scenario: Imagine making a reusable Phoenix component and you wa...
New
engineeringdept
In 2026 double submit/session tokens are no longer necessary to prevent against CSRF attacks. Instead, we can use the Sec-Fetch-Site head...
New
aglassman
Problem The cancel_async function is easily overlooked. Since the results of “outdated” tasks are ignored, it’s easy for developers to a...
New
calebjosue
I am reading (Once more) the Phoenix web framework documentation, in the From endpoint to views section contained in the Request life-cyc...
New
caslu
Recently (last week) this PR was merged in Ruby on Rails repository and i thought it could be nice to have in phoenix, basically what it ...
New
sodapopcan
This past weekend I’ve been doing some work on a PR to bring open_browser to PhoenixTest. For those who don’t know it, PhoenixTest is a ...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
9mm
I am constructing a JSON object (map) and I need to conditionally set a field. I’m trying to write proper elixir-way code… and I’m at a l...
New
chrismccord
As promised, the first release candidate of Phoenix 1.3.0 is out! This release focuses on code generators with improved project structure...
New
josevalim
Hi everyone, One of the features added to Elixir early on to help integration with Erlang code was the idea of overridable function defi...
New
alice
Hey, Just curious what are the main benefits of Elixir compared to Clojure? When is Elixir more useful than Clojure and vice versa? Th...
New
RisingFromAshes
I’ve read in another post that it may be possible with a router helper - but I couldn’t find an appropriate one, and tbh, I’m still just ...
New
saif
Hello everyone, Long time lurker first time poster here. I’ve recently begun working on Elixir full-time again! :raised_hands: It’s been...
New
Brian
What is the proper way to load a module from a file in to IEX? In the python world, doing something like this pretty standard: from ....
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New
svb
Hi! Currently I want to submit a form by pressing the Enter key. However, since my input field is of type “textarea” this is just adds a...
New

We're in Beta

About us Mission Statement