# show.html.leex

<form id="numbers_form" phx-change="select_numbers_event">
  <table class="view-board__panel-table">
    <tr>
      <th>Number</th>
      <th>Status</th>
      <th>Inserted At</th>
      <th>Select</th>
    </tr>

    <%= for n <- @numbers do %>
      <tr>
        <td> <%= n.number %> </td>
        <td> Active </td>
        <td> <%= n.inserted_at %> </td>
        <td>
          <label class="container">
            <%= inspect(n.checked) %>
            <%= inspect(n.id) %>
            <%= get_check_box(n.checked, n.id) %>
          </label>
        </td>
      </tr>
    <%end %>
  </table>
</form>


# number_view.ex

def get_check_box(checked, n_id) do
  ch =
    case checked do
      true -> "checked"
      _ -> ""
    end

  "<input #{ch} type=\"checkbox\"
    id=\"input_n_checkbox\"
    name=\"id\" value=\"#{n_id}\">
   <span class=\"checkmark\"></span>"
  |> Phoenix.HTML.raw()
end


# show.ex

def handle_event("select_numbers_event", %{"id" => id}, socket) do
  updated_numbers = socket.assigns._numbers
  |> Enum.map(fn n ->
    if n.id == String.to_integer(id) do
      Map.put(n, :checked, not n.checked)
    else
      n
    end
  end)

  new_socket =
    socket
    |> assign(:virtual_numbers, updated_numbers)
    
  {:noreply, new_socket}
end