sethsandaru/demo-vue-form-builder

Demo Vue Form Builder Usage with Laravel

Demo Vue Form Builder - Usage

With this repo, I'll show you the demo of Form Template & Form GUI.
For the Vue Form Builder, please visit: https://github.com/sethsandaru/vue-form-builder

Also, I will show to you how I will save and retrieve my configurated form template and render for user use it.

All backend code is using Laravel 5.7 (Just need Eloquent to do the job :D)

Most important you need to know

For the guys who didn't use PHP as the Backend, maybe Java, Go, Ruby,... Then you don't have to read all the stuff PHP.

You can simply traverse this list:

• Database Design
• How I handle the Insert / Update:
  • Insert:
  • Update:
• How I retrieve the Form for Update
  • Backend
  • Frontend
• How I retrieve the Form for Renderer
  • Backend - as same as for update
  • Frontend

Dependencies

• PHP 7+
• Composer
• MySQL

Install and test in your local machine

1. Clone this project
2. CD to the project's root
3. Run: composer install to install dependencies of Laravel
4. Config your database connection in .env file.
5. Run: php artisan migrate to create the table.
6. You can visit http://your_host/your_folder/public to test :D

Note: to turn on insert & update form config, you need to:

• Open file: config/sandaru.php
• Set disable_populate to true (Sorry for this inconvenience, I added this constraint to make sure my Live Demo doesn't have any trash data in there)

Live demo

You can visit my site here: http://vue-form-builder.sethphat.com

Copyright © 2018 by Phat Tran Minh aka Seth Phat.

demo-vue-form-builder's Issues

Wrong behavior when using the builder on SPA (Vue)

There is an issue when trying to change the src of data for FormBuilder.
My case that I have as below:

On page load, I am injecting the saved form configuration to FormBuilder, then the user has the ability to inject demo configuration by clicking on demo button.
He can make changes and click on reset button to reset the form to its default state.
Once I use the demo conf and make changes to the form... if I clicked on demo button again where the expected result is to reset the form config to demo base data, I am getting below error:

And the problems start to appear after that.

The issue is reproducible here as well:
https://vue-form-builder.herokuapp.com/

Steps to Produce:

1. Open https://vue-form-builder.herokuapp.com/
2. Click on Set JSON Form-Data (Basic Configuration / Builder)
3. Add controls to the generated form.
4. Click on Set JSON Form-Data (Basic Configuration / Builder) again.
5. Notice error messages in console.
6. Try to add new controls and notice again.

Thanks,

Small Readme update

Hi there - just a super small note - love the package, but in the readme, it says

Note: to turn on insert & update form config, you need to:

Open file: config/sandaru.php
Set disable_populate to true (Sorry for this inconvenience, I add this constraint to make sure that my Live Demo doesn't have any trash data in there)

This should actually be

Set disable_populate to false (Sorry for this inconvenience, I add this constraint to make sure that my Live Demo doesn't have any trash data in there)