إدخال الأرقام · الحدث

    <.number_input
  class="number-input"
  on_value_change="number_input_changed"
>
  <:label>Quantity</:label>
  <:decrement_trigger><.heroicon name="hero-chevron-down" class="icon" /></:decrement_trigger>
  <:increment_trigger><.heroicon name="hero-chevron-up" class="icon" /></:increment_trigger>
</.number_input>

  

    def handle_event("number_input_changed", %{"id" => id, "value" => value} = params, socket) do
  IO.inspect(params, label: "number_input_changed")
  {:noreply, socket}
end
  

    <.number_input
  class="number-input"
  on_value_change_client="number-input-changed"
>
  <:label>Quantity</:label>
  <:decrement_trigger><.heroicon name="hero-chevron-down" class="icon" /></:decrement_trigger>
  <:increment_trigger><.heroicon name="hero-chevron-up" class="icon" /></:increment_trigger>
</.number_input>

  

    const el = document.getElementById("number-input-events-client");
el?.addEventListener("number-input-changed", (event) => console.log(event.detail));

  

    const el = document.getElementById("number-input-events-client");
el?.addEventListener("number-input-changed", (event: Event) =>
  console.log((event as CustomEvent<unknown>).detail)
);