Git Product home page Git Product logo

bootstrap-form-builder-v3v4's Introduction

Bootstrap-Form-Builder-V3V4

A bootstrap 3.0 form drag and drop builder, implemented in Jquery. Based on: https://github.com/minikomi/Bootstrap-Form-Builder

Avaialble Demo at: http://formbuilder.tdjangoy.webfactional.com/

pyscripts folder has a simple Flask server to host the DEMO app. to Run the Demo locally::

$ cd <your_repo_path>/pyscripts
$ python flask_app.py 

For more detail on Flask, see: http://flask.pocoo.org/

New development on 2017-08-14

Added in two-column layout support. Click 'Select Form Layout' to choose 2-column form layout.

TODO/Limitations:

  • Now only support two columns layout
  • The two widgets in the same row have to be of the same height (otherwise you will see misalign-ment). We are actively working to fix it.

WIP: Better 2-column layout support, V4 Support

Bootstrap V4 formbuilder demo: http://formbuilder-v4.tdjangoy.webfactional.com/

bootstrap-form-builder-v3v4's People

Contributors

tonytan4ever avatar tonytan4ever-rchealth avatar tonytan4ever-tkninja avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

bootstrap-form-builder-v3v4's Issues

Validation Issue

Validation is not working , Using textbox and click on required, after rendered html page ,no vaalidation applay

How to put a select list in the form title popup

Hello, I am trying to edit app.js to add a select list along the name input in the form name popup, but whenever I change the "type" field to something else than input the form just disappear. How can I use a select list in this ?
Here's a glimpse at what I edited in app.js

myform_view = new MyFormView(
{
title : "Original",
columns : layout_number_of_columns,
collection : new MyFormSnippetsCollection(
[ {
"title" : "Form Name",
"fields" : {
"name" : {
"label" : "Enter form name",
"type" : "input",
"value" : "Form Name"
},
// Add a list of options
"category" : {
"label" : "Options",
"type" : "Select",
"values" :
[
{
"label":"Setting",
"value":"1",
"selected":true
},
{
"label":"Audio",
"value":"2",
"selected":false
}]
}
}
} ])
});

Save button does nothing

Hi there,
Why the Save Current Form Layout does nothing?? Is there something I have to do?
Thanks :)

Label component needed and required field.

It will be great to have Label component for showing information.
if a field is required, when it presents to users, it should have * appended along to indicate that it is a required field.

npm package

Hello,
can you please submit it to npm registry?

which brings more exposure.

Also, can you make v4 as master branch as bootstrap v4 is latest version

radio value changable

Hi, I am trying to find some way to make the radio value changable. Like the example below.
default
The last radio is changable for some other unpredictable value. I found a example from the Internet,
default
Is it possible to do this in our form builder?

Multiple Buttons in a row

It would be nice to have a configurable row of buttons. User can specify X number of buttons in one row.

wrong position() for dragged field, works with offset()

Hi
I tried to integrate your tool on my page but I found that the position of the dragged field was not recognized on the TARGET From, because of wrong coordinates.
After investigation I changed every use of position() function with offset() and seems work.
Every calls were in the file assets/js/views/my-form.js

Can you please check and, in case you agree, update the package ?
Thanks
Andrea

Flask Plugin

How easy to convert this to a flask plugin ? (I am new to flask ...)

how to remove tabs?

Hi Tony,
can you tell me how to remove tabs like rendered or add new tabs?

i tried removing all references but it doesn't go away, so we need to compile something or what?

thanks.

Adding forms within forms.

First of all, this was so brilliantly well-made that I've become in love with it, thank you for providing us with this. I learned a lot of new things from reading the code.

I'm changing a lot of things to the code as I need, but what I want to know is how would you go about to include a whole form inside the main form. I was already capable of adding an exact form replica to the listed components which can be dragged and dropped normally, but I was not able to let the components be added to the newly made form. How can I do that?

Thank you.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.