Hello! I stuck with the display flash at my LiveView template. And whatever I do, I don’t see the message on the page. I have two fields and handle_event. The content of the handle event isn’t important, but it’s important to understand that if I write an IO.input in it, I get a message in the console. But if I try to put_flash, nothing will happen
def handle_event("click", %{"content" => params}, socket) do
IO.inspect("test") # I see "test" in console
put_flash(socket, :error, "Error!") # I don't see flash on page
{:noreply, socket}
end
I also tried to write code like this:
def handle_event("click", %{"content" => params}, socket) do
IO.inspect("test") # I see "test" in console
# I don't see flash on page
{:noreply, socket |> put_flash(socket, :error, "Error!") }
end
and nothing happens.
Why don’t see flashes on the page? Could this be because tailwind and alphine.js were installed?
since Elixir variables are immutable the put_flash/3 in your first example doesn’t change your socket, but returns a new socket which you have to use.
In the second example you have to remove the socket from the put_flash. The pipe (|>) calls the next function with the return value of the previous one as first parameter automatically.
Your socket |> put_flash(socket, :error, "Error!") is the same as put_flash(socket, socket, :error, "Error!"), but you only want it once inside the call.
You could use either:
def handle_event("click", %{"content" => params}, socket) do
{:noreply, put_flash(socket, :error, "Error!")}
end
or
def handle_event("click", %{"content" => params}, socket) do
# This reassigns socket to the value returned by put_flash
socket =
socket
|> put_flash(:error, "Error!")
{:noreply, socket}
end
As a follow up to a question I asked earlier on the forum regarding implementing functions to be invoked from the templates.
In this case, one would perhaps use Phoenix.LiveView.JS to compose several JS commands to extend the generated flashes. I’m thinking of Chris McChord’s demo for the release of LiveView 0.17.
EDIT: SOLVED I tried this and it WORKED, i.e. calling inside handle_event. Delgating to another function send caused it to fail. I wasn’t sending the socket back to handle_event properly (I guess)
def handle_event("alert", values, socket) do
{:noreply, put_flash(socket, :error, "TEST ERROR")}
end
I have this problem too. I’ve tried all the suggestions above.
Notes:
default alert html is from live.html (not app.html.heex) as the class=XXXXXXXXXXX is on the page. This happens even if I remove the layout definition use Phoenix.LiveView, layout...
non-live views have the app.html.heex flash layout as expected
The flash message does not display, and the message text is not injected
The flash is appended to the socket as expected. So seems problem is that socket data is not making the html changes to the page.
This is a rough example of my code setup.
index.ex
defmodule MyApp.UserLive.Index do
use MyApp, :live_view
use Phoenix.LiveView, layout: {MyApp.LayoutView, "live.html"}
def handle_events(call, _values, socket) do
send(socket)
end
def send(socket) do
socket =
socket
|> put_flash(:info, "Alert sent successfully.")
{:noreply, socket}
end
end
import Phoenix.LiveView.Router
pipeline :browser do
...
plug :fetch_live_flash
plug :put_root_layout, {TurnStileWeb.LayoutView, :root}
...
end
scope "/", MyApp do
pipe_through :browser
live "/myRoute",
UserLive.Index,
:index
end
Hi @DOKL57, sorry but I don’t understand the solution at all. It’s too complicated. After pulling my beginner hairs out, I found the solution to be super simple!!!*.
You tried 2 methods in your original code. First:
^for this, the solution is simple. Do not return {:noreply, socket}. Instead, you should return {:noreply, put_flash(socket, :error, "Error!")}. Here’s a working example:
def handle_event("save", _, socket) do
{:noreply, put_flash(socket, :error, "Error!")}
end
For your second approach here:
^the solution is mentioned above by moogle19. You’re piping the socket into the put_flash() which means you’re actually writing put_flash(socket, socket, :error, “Error!”). Hence the error.
From moogle19’s explanation that “Elixir variables are immutable and the put_flash returns a new socket”, I looked again at what my function was returning and so found the solution to the bug in your first approach.
