Sort Collection Via Event Handler: Difference between revisions

From ElixirBlocks
Jump to: navigation, search
(Created page with "<source> defmodule AppWeb.SandboxLive do use AppWeb, :live_view alias App.TestBeds alias App.TestBeds.TestBed alias App.Repo import Ecto.Query def mount(_params, _session, socket) do testbeds = Repo.all(from(t in TestBed, order_by: t.name)) {:ok, assign(socket, testbeds: testbeds, sort_by: :name, sort_direction: :asc)} end def handle_event("toggle_sort_by_name", _params, socket) do current_direction = socket.assigns.sort_direction new_...")
 
No edit summary
 
Line 1: Line 1:
<source>
<source>
defmodule AppWeb.SandboxLive do
defmodule AppWeb.SandboxLive do
   use AppWeb, :live_view
   use AppWeb, :live_view
Line 15: Line 14:


   def handle_event("toggle_sort_by_name", _params, socket) do
   def handle_event("toggle_sort_by_name", _params, socket) do
     current_direction = socket.assigns.sort_direction
     current_direction = socket.assigns.sort_direction
     new_direction = if current_direction == :asc, do: :desc, else: :asc
 
     new_direction = case current_direction do
      :asc -> :desc
      :desc -> :asc
    end


     # Build query based on sort direction
     # Build query based on sort direction
Line 56: Line 60:


end
end


</source>
</source>

Latest revision as of 20:17, 17 April 2025

defmodule AppWeb.SandboxLive do
  use AppWeb, :live_view
  alias App.TestBeds
  alias App.TestBeds.TestBed
  alias App.Repo
  import Ecto.Query

  def mount(_params, _session, socket) do

    testbeds = Repo.all(from(t in TestBed, order_by: t.name))
    {:ok, assign(socket, testbeds: testbeds, sort_by: :name, sort_direction: :asc)}
  end

  def handle_event("toggle_sort_by_name", _params, socket) do

    current_direction = socket.assigns.sort_direction

    new_direction = case current_direction do
      :asc -> :desc
      :desc -> :asc
    end

    # Build query based on sort direction
    query = case new_direction do
      :asc -> from(t in TestBed, order_by: t.name)
      :desc -> from(t in TestBed, order_by: [desc: t.name])
    end

    testbeds = Repo.all(query)

    {:noreply, assign(socket, testbeds: testbeds, sort_by: :name, sort_direction: new_direction)}
  end

  def render(assigns) do
    ~H"""

    <div>
      <!-- Name header with click to toggle sort -->
      <button phx-click="toggle_sort_by_name">
        Sort by Name
        <%= if @sort_by == :name do %>
          <%= if @sort_direction == :asc do %>
            ▲
          <% else %>
            ▼
          <% end %>
        <% end %>
      </button>

    </div>

    <ul>
      <%= for testbed <- @testbeds do %>
        <li><%= testbed.name %></li>
      <% end %>
    </ul>
    """
  end

end