Feedback request on new Item form with Elixir and Phoenix

Phoenix Forum Questions / Help
1

New Item Form with Elixir and Phoenix

What do you think of my new Item form? I followed @phoenixinaction, but I’ve upgraded to the latest versions of Elixir and Phoenix.

I decided to ditch the <%= form_for %> based on insights from a forum post by @josevalim.

:link: Check out my code on Gist!

Tags: #WebDev #PhoenixFramework

Code:

<h1 class="text-2xl font-bold mb-4">New item</h1>
<.form :let={f} for={@item} action={~p"/items"} class="space-y-4">
    <%= if @item.action do %>
    <div class="bg-red-500 text-white font-bold p-4 rounded-md shadow-md">
        Unfortunately, there are some uuupppsiiis in your submission. Please correct them below.
    </div>    
    <% end %>
    <label class="block">
        <span class="text-lg font-medium">Title</span>
        <.input type="text" field={f[:title]} class="mt-1 p-2 w-full border rounded-md" />
    </label>

    <label class="block">
        <span class="text-lg font-medium">Description</span>
        <.input type="text" field={f[:description]} class="mt-1 p-2 w-full border rounded-md" />
    </label>

    <label class="block">
        <span class="text-lg font-medium">Auction ends at</span>
        <.input type="datetime-local" field={f[:ends_at]} class="mt-1 p-2 w-full border rounded-md" />
    </label>

    <input type="submit" value="Save" class="mt-4 bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded" />
</.form>
1 Like
2

With the introduction of HEEx extension: special attributes for if and for blocks, this could be re-written as <div :if={@item.action} class="...">...</div>.

4 Likes
3

thank you

1 Like