How can I send a submit message to a livecomponent form from a liveview?

Questions / Help
,
1

I have a modal that is managed inside of the parent liveview. The modal contains a form component. Since the buttons on the modal are at the top-level, I can’t submit the form directly.

How can I send a message to the form component that’s in the modal in order to submit it?

<%= case @modal_action do %> # .......... <% :record_decision -> %> <.live_component module={Modal} id="record-decision-modal" title="Record decision" subtitle="Add a new decision to record the associated reasoning and discussion." cancel_action="cancel_modal" confirm_action="create_decision" confirm_text="Create Decision"> <.live_component module={Decisions.Form} id="decision-form" account={@current_account} /> </.live_component> <% _ -> %> <div class="hidden"></div> <% end %>
2

I believe you can use the JS.push to make sure the event is handled by your LiveComponent.

There’s also phx-target.

Here’s a write up by fly.io that explains further.

3

Thanks, I think I’ll do it with with JS module. Makes a lot of sense after reading that article cheers.