I need create a web where users add dynamically form controls

[Rafa]

My idea is a menu where user select type of control for create his own form. 

In a menu could select input text , textarea, checkbox, etc an thouse controls

The new form and those controls would be written to databases as a user-created form. 

The user could add required or validation options.

My question is, how would you do it? 

Do you think is a good way if I create tempates html for every type of control so wen user add, for example, 5 input text and 1 textarea all of this controls are basic templates.

Then, in that template the user can add especific label name and set especific max values, if it is a required field, etc.

How would you plan an application like this?

I need some ideas of games or ideas on how to approach this type of project.

Thinking always that later, in the future, add the possibility that the user can add datepickers fields or WYSIWYG fields for example.

Even the user would be able to add more complex controls like dependent fields like select options controls dependant.

The final idea is that a user could create his own form adding fields or controls, basic controls that he can  configure with more features like if it is required or no etc.

Need a basic simple resumen idea you would do it, contrast for do it in the most correct and extensible way and with good performance in case a lot of forms fields.

I appreciate all kinds of more developed ideas or simple basic ideas of how you would approach it

Thanks in advance

Thanks in advance.

[Rafa]

My basic idea is create forms in angularJs from a JSON with lots of configurables features in the JSON like labels, if is required, validation rules, etc

[Sander Elias]

Hi Rafa,

This is very well possible. My friend Juri did a blog post with a possible way to do it. There are more possible solutions. This is a very good way to get started with it.

Regards

Sander

[Rafa]

I'm going to take a look at this to see if it gives me ideas

[Rafa]

I have been confirmed by my clients that the development of dynamic forms should be based on Angular 1.xx

Apparently angularjs 1.xx ihas less possibilities than the version 2.xx which is the example that you post me. Do you know, some way to implement dynamic forms with angular 1.x I have seen modules out there but I would like, if possible, not to depend on closed modules that later on would not allow me to expand or adapt according to the future needs of production

I think i must do it with directives for every control Type and must admit params (is required, max o min, is email validations etc)

In json notation we have a lot of control especifications for render them in the form .

In the future is posible add controls as datepickers or dependent selects, etc. So I think we a control must be a combination of a directive an a template in angular 1.x

You know something about how to deal with this idea? something where start to dig.

Thanks in advance for your help

El lunes, 30 de octubre de 2017, 11:10:39 (UTC+1), Sander Elias escribió:

[Sander Elias]

Hi,

have a look at http://angular-formly.com/#!/

Regards

Sander

[Rafa]

Hi Sander, 

It seems the most interesting option, it supports angularJs 1 and a lot of possibilities that I know I will need as cascade select and more. 

I think I will focus for now on this solution for my current project as long as clients do  not change  specifications.

But only with the intention of having all the possibilities controlled,  Do you know of any tutorial that explained how you could do this type of things manually only with angularJs 1.xx tools?

I was looking late yesterday and it seemed very strange to me that I did not find anything on this subject.

Wanted to get an idea of ​​how to work using basic directives and html templates for define and create each basic control for a form  and then,  according to a JSON,  display them with certain basic properties such as name, data model assigned in the JSON etc.

 

Basically I want to make what this library already does, but using only the tools of angularJs 1.xx becouse I think I must have this front controlled too just in case.

Thank you for your useful help 

[Sander Elias]

Hi Rafa,

Take a look at the source of formly. Also there are a number of blogs on this subject, just google a bit for it. here is one: https://scotch.io/tutorials/building-dynamic-angular-forms-with-ngrepeat-and-ngform

Regards

Sander