Dynamic form creation

Hello,
I am using the webix library and I have a requirement to build the forms dynamically,means building the web form builder.
So there are two ways I am thinking,
1:providing the form components in list and once the user select(double click) the component from list, the component has to come and sit in form and once we submit the form, the value should transfer to the server.
2:providing the form components in list and providing the option to build the web form by draging and droping the components in the form, once we submit the form, the value should transfer to the server.

Request you to provide suggestion on this topic whether we can achieve this functionality using Webix or not.Please provide the updates ASAP, so that we can start our activity.

Comments

  • You can implement both scenarios, but second one will require a bit of extra efforts.

    Scenario (1) is quite easy, you can add|remove elements of form through API. And you can get its current state ( serialization of config ) as well.

    Scenario (2) can be done, but you will need to write some code to handle the DND process ( we have local project of visual UI builder, which uses the same technique to build any webix interfaces. Functionality for dragging elements, and building UI from them was done with public API without any tricky hacks )

  • Thank you for the suggestion.I appreciate your response.
    Can you please share the code snippets for the scenario (1) to add and remove elements of form through API.And please do suggest which API I should use.
    Scenario(2) : can you please share the code to handle the DND process of visual UI builder for reference.

  • This code is working fine,thank you.
    But i am not able to rearrange(drag and drop) html elements within the form and onClick event for form item is not working.Can you please suggest the solution for that.Even please do suggest which API i should use to add/remove elements,with code snippets.

    Also expecting code for 2nd scenario.

  • Also expecting solution to save dynamically created form.

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!