ntamer

ntamer

card disappears when pressing on the "x-mark" icon

Hi All,
Please I need help as I’m very new to phoenix framework and elixir…
I’ve implemented a card and i want when a user clicks on the “x-mark” icon the card exits.
This is my code
Mount Function:

@impl true
def mount(params, _session, socket) do
user_id = socket.assigns.current_user.id
{
:ok,
socket
|> assign( :setup_card, true)
}
end

Handle function:

def handle_event(“hide_card”, _ , socket) do
{:noreply, assign(socket, :setup_card, false)}
end

Update funtion:

@impl true
def update(assigns, socket) do
IO.inspect(assigns)
{:ok,
socket
|> assign(assigns)}
end

HTML code icon:

<.icon name="hero-x-mark" class="w-5 h-5" />

Live_component of the whole card:

<.home_setup_account current_user={@current_user} setup_card={@setup_card} :if={@setup_card} />

First Post!

slouchpie

slouchpie

<div phx-click="hide-card" class="cursor-pointer">
 <.icon name="hero-x-mark" class="w-5 h-5" />
</div>

Last Post!

slouchpie

slouchpie

When you tried this phx-click attribute, did you see anything in your logs when you clicked it?

I am talking about the “logs” that appear in your shell/terminal when you run mix phx.server.

Maybe there is some log about the "hide-card" event?

Last question: are you using a LiveComponent (Phoenix.LiveComponent — Phoenix LiveView v1.2.5) or is it just a normal LiveView? If you are using a live component then you need to also use the target attribute, like this:

<div phx-click="hide-card" target={@myself} class="cursor-pointer">

Where Next?

Popular in Questions Top

rms.mrcs
Hi, I need to transform a list of numbers into a map where the keys are the indexes and the values are the original values of the list. ...
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
Lily
In templates/appointment/index.html.eex: &lt;%= for appointment &lt;- @appointments do %&gt; &lt;tr&gt; &lt;td&gt;&lt;%= appoi...
New
WestKeys
Currently suffering from paralysis by [HTTP client] analysis. This is rather unusual in Elixirland as there tends to be consensus on the ...
New
Harrisonl
We have an ECS cluster with 4 services, where each task joins a single cluster, via discovery ECS discovery service. Currently when I de...
New
jason.o
In the code below, if the create action is not set to accept “extra_key” as an input, it errors out with a message shown above. Is there ...
New

Other popular topics Top

electic
Hi, I am new to Elixir. I am trying to use the DateTime component to insert a date into MySQL however the there seems to be no way to fo...
New
stefanchrobot
What’s the safe way to decode a JSON string into a struct? I want to avoid calling String.to_atom. Jason.decode can give me a map with st...
New
Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
joeerl
Hello again - after a longish gap I’ve decided I really must dig into Elixir and see what’s been happening here - so I have a few questio...
New
gshaw
What is the idiomatic way of matching for not nil in Elixir? E.g., First way: defp halt_if_not_signed_in(conn, signed_in_account) when...
New
AstonJ
Posting this to see if we can make things easier for people to get into Neovim. If you use Neovim and have a favourite distro please let ...
New

We're in Beta

About us Mission Statement