Serenity: Form builder

Created on 2 Apr 2020  路  11Comments  路  Source: serenity-is/Serenity

I want to generate Form based on some properties defined in single class with multiple formScript dynamically, can it possible to generate dialog with several Form properties?

your help is highly appreciated, Thanks!

Most helpful comment

@KishanVaishnani
This would be a nice thing to include in the WIKI if you have achieved it.
Each one of us has different requirements at different times and it just makes things quicker for each one when there is an example provided in the wiki.

All 11 comments

Hi @KishanVaishnani ,

I suggest that you look into Serenity.Codegenerator. This is the app which creates static forms and dialogs out of existing SQL tables. As the browser on client-side understands javascript and HTML - and javascript can be dynamically created and executed (eval function) and HTML can be dynamically created and then attached to the existing DOM, the generic answer is yes.

But it will require a very good understanding of many things:

  • Serenity framework
  • jQuery (including jQuery UI Dialog)
  • HTML
  • javascript
  • the DOM
  • ASP.NET MVC

and I never have heard here in the forum that somebody already has generated a dynamic form.

Actually, the dialog is dynamically created according to the field definition in xyzForm.cs.

The question is, what you really do want to achieve. Dynamically creating a dialog which looks like a standard serenity dialog - or just a jQuery UI dialog with completely random content.

So in order to possibly help a bit further, we need more details. Maybe you can add here a mockup on what you want to achieve.

With kind regards,

John

hey @JohnRanger

Thanks for your reliable answer,

Yes, I want create a dialog using standard serenity dialog with passing dynamic form fields

Hi @KishanVaishnani ,

I think, then it boils down to:
1) dynamically create the xyzForm class in-memory (xyzForm.cs is a C# class)
2) dynamically create the required client-side scripts (this is normally statically done with T4 transform - but I don't yet understand all the details. Here you will have to investigate on your own).
3) Instantiate a new instance of the corresponding xyzDialog.ts of type (<the so generated client-side representation of the dynamic form class>).

For how to create dynamic c# classes, please have a look at this SO article: https://stackoverflow.com/questions/3862226/how-to-dynamically-create-a-class

Important:
But please keep in mind that this will not allow you to dynamically generate these forms at runtime and keeping them changing for every user and situation individually. They will dynamically be generated once at startup of your application on the webserver - and then remain static until shutdown of same app on web server (all different user sessions after startup of your app on your web server will receive the same dynamically at startup generated - and now static until shutdown - form).

Hope this gives you a generic idea of what a dynamically generated form could be useful for - and if it fits to your requirements.

As I so far never had to do this, I cannot really give you a step-by-step help. But again - Serenity.Codegenerator does all of this statically. Please have a look at its source code and follow its internal workflow in order to find out what exactly is done "left and right" when it generates a xyzForm.cs.


But maybe there is an easier solution for what you want to achieve: What is the reason, why you want to generate the forms completely dynamic? I am asking, because a form still relies on a static xyzRow.cs. If your reason for the full dynamic forms is because you want to have some fields appearing in situation 1 and have at the same time some fields hidden which are only showed in situation 2, then there is a much easier solution.

If you give us a bit more insight what you want to achieve overall (high level goal why you think that a dynamically generated form is necessary), then we can help better.

With kind regards,

John

@JohnRanger Thanks for the clarifications, I got nearly solution with the help of Serenity.PropertyGrid, through we can pass propertyItems[] and based on that we need to pass the xxxForm editors.

Thanks!

@KishanVaishnani can you please put some more information on how you have achieved it.

@KishanVaishnani
This would be a nice thing to include in the WIKI if you have achieved it.
Each one of us has different requirements at different times and it just makes things quicker for each one when there is an example provided in the wiki.

@stixoffire Sure I will try to create one sample example

@stixoffire Sure I will try to create one sample example

I have encountered this problem recently. Can you explain it in detail or provide a simple example?

Hi @KishanVaishnani

Looking forward for a sample. your support is highly appreciated. Thank you.

@stixoffire Sure I will try to create one sample example

@KishanVaishnani any progress on this? I'm also interested on this topic

Hi @KishanVaishnani

Looking forward for a sample. your support is highly appreciated. Thank you.

@stixoffire Sure I will try to create one sample example

@stixoffire did you got chance to look on this

Was this page helpful?
0 / 5 - 0 ratings

Related issues

john20xdoe picture john20xdoe  路  3Comments

ahsansolution picture ahsansolution  路  3Comments

GitHubOrim picture GitHubOrim  路  3Comments

dkontod picture dkontod  路  3Comments

Akarsh03 picture Akarsh03  路  3Comments