How to sharing data among input fields of the same LiveView form_component?

After inputing x and y in the same form, the sum of x and y is expected to be calculated in real time. How?

<.input field={@form[:x]} type="number" label="X"  />
<.input field={@form[:y]} type="number" label="Y" />

<.list>
   <:item title="Sum"><%= :x + :y %></:item>
</.list>

Thank you for reading. :slightly_smiling_face:

If you’re using the generated form component, then after the handle_validate callback, those values should be accessible with @form[:x].value and @form[:y].value.

Also, depending on whether x and y have default values and what should be displayed when none or just one of the values have been set, there may need to be an :if on the .list component or :item slot.

3 Likes

codeanpeace

Thank you always. :grinning: