Handling multiple levels of nested inputs_for in liveview

Hey everyone,

I’m building an app at the moment that has a data structure similar to the following simplified example.


schema "pages" do
  field :name, :string
  has_many :sections
end

schema "sections" do
  field :name, :string
  has_many :products
end

schema "products" do
  field :name, :string
  has_many :sizes
end

schema "sizes" do
  field :name, :string
end

Form then like

<%= f = form_for @changeset, "#", [phx_submit: :save, phx_change: :validate] %>
  <%= text_input f, :name %>
  <%= inputs_for f, :sections, fn s -> %>
    <%= text_input s, :name %>
  <%= inputs_for s, :products, fn p -> %>
    <%= text_input p, :name %>
    <%= inputs_for p, :sizes, fn s -> %>
      <%= text_input s, :name %>
    <% end %>
    <a href="#" phx-click="add_size" phx-value-product-id="<%= p.data.id %>">Add Size</a>
  <% end %>
  <a href="#" phx-click="add_product" phx-value-section-id="<%= s.data.id %>">Add Product</a>
  <% end %>
  <a href="#" phx-click="add_section">Add Section</a>
</form>

I’ve gotten the handle_event for add_section done but I’m not sure how to do the handle product and handle size in a good way. If you’ve done this already could you give me a hand please? I’ve left them off but same issue for the remove functions.

2 Likes