kevinchappell/formBuilder

A jQuery plugin for drag and drop form creation

Rahin Makrani

@rahumakrani

Can someone help me? please

Can someone help me? I'd like to hide/remove Options from AutoComplete, please advise how to achieve this?

MuhammadRafiqKhan

@MuhammadRafiqKhan

hi there
can someone help me i want to use this library/plugin but i want to give style to the drag and drop portion
i want to use this in HTML,CSS,BOOTSTRAP

RAGHV143

@RAGHV143

Hi can someone help me,my requirement is that i want to console json by creating by form builder because i want to store this data in nosql data base

how is it possible

Vaibhav Jain

@VJ1994_gitlab

Hi, can someone help me, my requirement is that i want to make predefined field & also disable the properties/attributes of the field except placeholder.

Johann Hernández Armenteros

@johha86

Hi, is in some place any doc of how to add bootstrap style

gharri

@gharri

Hi, How can I add the dependencies just by javascript tags, instead of installing node js? Maybe I need to edit the source code, so the minimized js file is not helpful for me. Thank you.

Andrei

@stg-andrei

Hey guys, I cloned the project from github in order to make my own custom plugin (a table matrix, I built it with html and jquery and I am trying to import it in formBuilder)
Basically as a starter I duplicated the starRating.js custom plugin from src/js/control_plugins, I renamed it and did
npm start build:all and npm start, but I dont get it its not showing up when my local dev server is launched in my browser..and I missing something?

taag me pls if anyone can help with the confusion

Andrei

@stg-andrei

the docs i ve been reading are found here: https://formbuilder.online/docs/formBuilder/control-plugins/

lappi357

@lappi357

Hello Everyone

Can someone help me out in creating a nested element like below
{
label: 'User Agreement',
fields: [
{
type: 'header',
subtype: 'h3',
label: 'Terms & Conditions',
className: 'header',
subSection : [
{
type : 'text',
label : 'Test Child'
},
{
type : 'checkbox',
label : 'Test Child'
},
{
type: 'textarea',
label: 'Short Bio:',
className: 'form-control',
}
]
}
],
}

lappi357

@lappi357

I just need to create a Sub section element

wangzhongfei1

@wangzhongfei1

Can someone help me? I want to know how to get the instance array of custom plugin from src/js/control_plugins.

@kevinchappell

wangzhongfei1

@wangzhongfei1

wangzhongfei1

@wangzhongfei1

Can someone help me? The setData in the screenshot doesn't work

2 replies

afrizal muchrom

@afrizalmuchrom:matrix.org

[m]

hi all, iam new member

WhatsApp Image 2021-07-09 at 12.29.33.jpeg

i just use formBuilder in my laravel, and work, but i want to create dropdown for field/control like this, please help me.. thanks before :) *sory my bad english

gaurav-techies

@gaurav-techies

can formbuilder give output in html css or hbs

Vaibhavi Sojitra

@vaibhavisojitra25

Hello
can anyone help to fix issue about File Uploading ?
I have a web portal in laravel framework. there is a form builder where i can create form. In that form if am putting multiple File upload fields and uploading files with same extension , it saving only one image .. But if am uploading different extensions like abc.jpg and xyz.png. its working fine.

Suganya209

@Suganya209

Hello
Can anyone help me to fix this?

I have created the checkbox with the labels, 'Blue', 'Green', 'Red'. And the following is the checkbox data,

{
"type": "checkbox-group",
"required": true,
"label": "Colors",
"name": "checkbox-group-1626754981357",
"values": [
{
"label": "Blue",
"value": "Blue"
},
{
"label": "Green"
},
{
"label": "Red"
}
]
}

I select the green color from the checkbox. And I'm getting the following user data.

{
"type": "checkbox-group",
"required": true,
"label": "Colors",
"name": "checkbox-group-1626754981357",
"values": [
{
"label": "Blue",
"value": "Blue"
},
{
"label": "Green"
},
{
"label": "Red"
}
],
"userData": [
"on"
]
}

In the userData array, it is returned as ['on']. The green color checkbox is not selected. To avoid this issue, value has to be provided for all the labels. But in the form builder, the values are optional. How do I enforce it in the form builder to give values for all the labels? Kindly help me to fix this issue.

Rogério Carrasqueira

@rgcarrasqueira

Hello Guys! Nice to meet you!

I would like to know if someone knows how to create a custom control that avoid field repetition in the form. For example I've created a custom control that brings a email field to the form but I don't want to allow the user to drop the field twice in the form. Is that possible?

Thanks so much for the help!

Rogério Carrasqueira

@rgcarrasqueira

Hello Guys! Is it possible to make checkbox-group not editable?

ketanbacancy

@ketanbacancy

Hello All,
How can i add events on attribute of control ?
Like i need to make name attribute dynamic. Means i want same name attribute as lable

elliehachemjob

@elliehachemjob

hello can you help me?

crazykenvn

@crazykenvn

Hello, can some one help me to create my custom select control? i want to create my own select load data from database

Robert Kemp

@RobertWKemp_twitter

Hello, does anyone know of a way to add a subtype of div to the paragraph element?

Shakil Hasan (hasan)

@shakilhasan

formRender setData not Work ?? @kevinchappell @wangzhongfei1 @afrizalmuchrom:matrix.org

jayden626

@jayden626

try this

const formRender = $('.render-wrap').formRender({
        formData: formData
});

Kevin Hakman

@khakman_twitter

How can I set a property on a form control that will tell formRender to not render that form control. For example, under condition "A" I need to enable a form field to be required. Under condition "B" that same form field can optional -- BUT I also do not want to display it. Conceptually it's not applicable under condition B at all. However, since the user might switch conditions from B back to A... removing the control from the model of the form would be be easily feasible. What property needs to be set on a form control to tell formRender to render it hidden or render it disabled, or omit rendering it even though it's in the form model.?

Kevin Hakman

@khakman_twitter

above, I means removing the form control form the model would lead to problems if it needed to be added back. Simply hiding or disabling (or both) for the optional control would be a better solution. But how can this be done?

jayden626

@jayden626

@khakman_twitter try the depends_on plugin here https://github.com/rendezz/formbuilder_depends
There's still some issues with it, but should get you going. Note this issue rendezz/formbuilder_depends#5

Kevin Hakman

@khakman_twitter

Thanks!

JasonVonKrueger

@JasonVonKrueger

Has anyone been successful at creating a section with two columns? Using a custom field and template almost gets me there. But I haven't figured out how to get the drag/drop events to work. The ondrop and ondragover attributes in the code below is just something I was trying.

    var fields = [{
        label: 'Two Columns',
        attrs: {
            type: 'twoCol'
        },
        icon: '❙❙'
    }];

    var templates = {
        twoCol: function(fieldData) {
            return {
                field: '<div class="two-column-container"><div ondrop="drop(event)" ondragover="allowDrop(event)"></div><div ondrop="drop(event)" ondragover="allowDrop(event)"></div></div>',
                onRender: function() {
                    //                     $(document.getElementById(fieldData.name)).rateYo({
                    //                         rating: 3.6
                    //                     });
                }
            };
        }
    };

gunner11012253

@gunner11012253

I am using form render.
Can someone help me how can I display 2 or more columns

BriskBrain

@BriskBrain2_twitter

When submit my form at that time i want to store data as json format

whe submit my form at that time i want to trigger onSave method Please suggest me. Thank you. Manish Bhuva

ashwinikaddekatc

@ashwinikaddekatc

when i run project i get error TypeError: Cannot set properties of undefined (setting 'actions')

Radhe saini

@radhesaini

sir how can add validation in forms

EffBureau

@EffBureau

Hey, is it possible to implement my own components instead of the base ones?

Does this plug in work well in angular?

Jamie Jones

@jamiejones85_twitter

I'm looking to extend the functionality of the radio button control so that the options list can have an additional data field captured on the builder, e.g. I want the builder of the form to be able to input a value along with the text & value to use in business logic if the user has selected that option. Are there any examples of similar?

12 replies

aishwaryak27

@aishwaryak27

Hey, I have a question. How can we add any new input filed details in edit section of any control.. I want it to be editable . Also for git package , when I include form-builder.js I am getting following error: SyntaxError: Cannot use import statement outside a module

Jamie Jones

@jamiejones85_twitter

Any one got any examples of getting the file uploader control working? Can't find how to initiate the actual upload

nikunjw3nuts

@nikunjw3nuts

Hello All,

How to create own custom field ?
Like below screenshot

And without subtype

Where communities thrive

People

Repo info

Activity