How to Capture Text of Items When Clicked: Difference between revisions
From ElixirBlocks
(Created page with "=Example= <source> defmodule AppWeb.PageLive do use AppWeb, :live_view def render(assigns) do ~L""" <div id="list-container"> <ul> <%= for item <- @items do %> <li phx-click="capture_text" phx-value-text="<%= item %>"><%= item %></li> <% end %> </ul> </div> """ end def mount(_params, _session, socket) do items = ["Item 1", "Item 2", "Item 3"] # Example list items {:ok, assign(socket, items: items)}...") |
No edit summary |
||
| Line 7: | Line 7: | ||
def render(assigns) do | def render(assigns) do | ||
~ | ~H""" | ||
<div id="list-container"> | <div id="list-container"> | ||
<ul> | <ul> | ||
<%= for item <- @items do %> | <%= for item <- @items do %> | ||
<li phx-click="capture_text" phx-value-text= | <li phx-click="capture_text" phx-value-text={item}><%= item %></li> | ||
<% end %> | <% end %> | ||
</ul> | </ul> | ||
| Line 17: | Line 17: | ||
""" | """ | ||
end | end | ||
def mount(_params, _session, socket) do | def mount(_params, _session, socket) do | ||
| Line 30: | Line 32: | ||
end | end | ||
</source> | </source> | ||
Latest revision as of 18:48, 10 June 2024
Example
defmodule AppWeb.PageLive do
use AppWeb, :live_view
def render(assigns) do
~H"""
<div id="list-container">
<ul>
<%= for item <- @items do %>
<li phx-click="capture_text" phx-value-text={item}><%= item %></li>
<% end %>
</ul>
</div>
"""
end
def mount(_params, _session, socket) do
items = ["Item 1", "Item 2", "Item 3"] # Example list items
{:ok, assign(socket, items: items)}
end
def handle_event("capture_text", %{"text" => text}, socket) do
IO.inspect(text) # Handle the captured text as needed
{:noreply, socket}
end
end