In this episode, we notice that while adding a new card or column autmatically focuses the input so you can type right away, we forgot to do this for editing an existing column. So, we jump into the column component and tweak it so the input field gets focused as soon as you start editing.
We use an x-if
to only render the editor when needed, and then hook into Alpine's x-init
so that when the input appears, it immediately receives focus. This way, you don't have to click again before typing. We wrap up by checking the change in the browser—now, as soon as you edit a column, you can start typing the new name right away. Much better UX!