forms icon indicating copy to clipboard operation
forms copied to clipboard

Dynamic forms

Open endenwer opened this issue 9 years ago • 4 comments

I need to create a form with dynamic fields. For example, there is a project form. I select project type and then I see different fields depending on project type. I didn't find how I can do it with this library. Now I can only separate this different fields to different forms and create required form when select project type. But that's not convenient.

endenwer avatar Oct 15 '16 12:10 endenwer

@endenwer There are multiple approaches:

  1. You can use one form and make validators check the form state before validating the field. Validator functions receive the whole form object as an argument to allow this. Check this example to see how it's done.
  2. You can use multiple forms approach

In the project I'm currently working on, I use both approaches based on the amount of fields that change. I have some forms where some fields are shared and some are different (based on type) - in that case I would have a "master" form for shared fields and a separate subform for each type. I found this approach to work really well as form complexity grows.

retro avatar Oct 15 '16 12:10 retro

@retro thanks. But how do you create subforms? Do you place subforms in atom in "master" form component and when swap it to new form when required?

endenwer avatar Oct 15 '16 12:10 endenwer

@endenwer I wrap multiple forms in a record that keeps track of the current state. Unfortunately the code is to specific to share it, but I've built a structure around it. It also depends if you're using the forms lib with Keechma, because I wanted to be able to use forms with the Keechma. controllers, so the implementation is built to support that.

I'm will have a blog post about it some time soon, because this is a tricky problem to solve, and I want to share my ideas

retro avatar Oct 23 '16 20:10 retro

Yes, I use the forms lib with Keechma. It would be very great to have an article about building complex forms.

endenwer avatar Oct 24 '16 05:10 endenwer