Form Builder ready for testing!

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
nedjo's picture

After a lot of fine work on Avi's part, his formbuilder.module is ready for testing.

The code is in Drupal CVS but needs separate downloading because it includes two external open source but non-GPL libraries: jQuery and PEAR's JSON package.

I've put the latest version for temporary download here.

To test:

  1. Install and enable the module.
  2. Optional--change settings of your sidebar blocks so they don't display at admin/formbuilder. The UI is wide and otherwise, depending on your screen size/resolution, it may not fit.
  3. Navigate to admin/formbuilder, and follow the links.

The UI allows you to:
1. Add new elements to a form and set their attributes.
2. Rearrange the order of elements.
3. Preview the rendered form (through an AJAX request to the server, which uses drupal_get_form() to render the code).
4. View the form in PHP code (again, through an AJAX request, which constructs the $form array using var_export() calls).
5. Save the form.
6. Load previously-saved forms.

The attached screenshot shows the element editing interface.

There are a few remaining issues and tweaks that Avi will be working on this week. We're also working on a demo site, so that you can test it out without having to install it on your site. I'll post an update here when that's ready.

Meanwhile, enjoy, and please post your comments here.

AttachmentSize
formbuilder-editing.png16.84 KB

Comments

Great Work

Anonymous's picture

Great work on the formbuilder! Congrats!

just a note...

silence's picture

Formbuilder stores the forms in an variable called "formbuilder_forms". To use the form you created using the formbuilder, You can do the following

$formid = 'id_of_the_form_you_created';
$forms = variable_get('formbuilder_forms', array());
$htmlFormCode = drupal_get_form($formid , $form[$formid]);

I have not tested above method but It should work. If it does not, please post a comment and I'll work on a proper solution =)

Example of use

marton's picture

Hello
For a newbie-drupal user there are some unanswered questions :-)
how do I use a form I have created?
Just a simple example would be great :-)

Could you explain a bit more

silence's picture

Could you explain a bit more where you want to use the form you created? You can have Polls etc if only that is required. If you just want to display a form, you can follow the example I posted in my previous comment. Here's some tested code for the same:

<?php

$formid
= 'abc';   // I created form 'abc' using formbuilder
$forms = variable_get('formbuilder_forms', array());
return
drupal_get_form($formid , $forms[$formid]);
?>

You can insert this code in a story provided php code is allowed.

I could not find any other way to use it right now except in modules etc which would be a bit more advanced.

New to Form Builder: Please help

aboonavas's picture

Hi,

I installed Form builder, JQuery and necessary modules.

I can see a Form Builder example on the left side panel.

But I cannot see anyother option to actually make Forms anywhere.

Here is a link to the screenshot: http://www.roomsharelondon.com/screenshot.JPG

I know this might be a very basic thing for all of you guys. But please help.

Just a tip to start will be great and any links to further help!

Thanks

me too

mrgoltra's picture

Awesome work!

I was reading your post and I want to implement the form I just have created. I was thinking if it was possible to create a node type and paste the code there?

for example form-1-node.tpl.php and put the code within that page?

Sorry, still learning.

Mark

just a note...

coupet's picture

Thanks! Implementation in demo would help.

Ajax form creator demo
http://freewebs.com/socdemocode/prototype0/

Chaining - Multiple fields

coupet's picture

Implement Chaining - Multiple Field

Multiple fields can be hooked together in a way that implies dependencies between fields. The most common use case is when using multiple select or dropdown fields.

Example use may include
- user select a make, model, and year of car.
- user select a country, state/province, and city.

Reference:
Chaining - Multiple fields
http://ajaxtags.sourceforge.net/advanced.html

Darly

Chaining

uniterre's picture

Yes,
We definitely need to create dependencies between fields. If someone know how to create this, I'm really interested.

Alexandre
http://www.uniterre.com : l'annuaire des carnets de voyage, blogs de voyage

http://www.uniterre.com : l'annuaire des carnets de voyage, blogs de voyage

Nice work

Jaza's picture

Great job you've done, Avi! This is a fantastic module, and one that will certainly be used in many places in the next-generation of Drupal interfaces. As a developer, I particularly like the 'PHP code' view - this feature means that you can essentially use the module to quickly generate form-definition code for you (Visual Basic-style :P), which you can then paste into another module (where you can clean it up, and modify it a bit, before you have the code that you need).

A few important things seem to be lacking at the moment. For example, I wasn't able to delete form elements that I'd created, and I also wasn't able to re-order them (either by graphically dragging the elements, or by setting #weight properties). The JS also seems to have a few rough edges (e.g. form elements not lined up properly, focus/fade effects a bit kludgy), but that's just cosmetic stuff, which I'm sure will be fixed up in due course.

Jeremy Epstein - GreenAsh

Jeremy Epstein - GreenAsh

My experience

kazim59's picture

Form Builder - Avi Mehta
The form builder offers much simplicity and ease of use over the pain of making Drupal forms. Moreover it has special items particular for Drupal like 'Weight' etc.

1) Could not figure out how to group radios. The form item 'radios' allows only two options to be set. Similar with select. How to go for more?

2) Why is every item's Title always set to "Edit". Leave it empty by default.

3) I had problems understanding the concept of #tree and #parents. Why they are missing?

4) The password_confirm item is enough for making two fields (one for password and another to confirm it). This was not obvious to me until tested.

5) Intuitive design. Ease of working with forms. But the properties bar can be made more clear. Sometimes it is confusing. We can use more space from the page.

Some feedback

sanketmedhi's picture

Great job, Avi. The Form Builder looks really good. Here are a few things I would like to list which might be like a users' opinion for your project.

  1. The form builder seems very useful but needs to be more intuitive from the user's point of view. The look and feel should be redesigned a bit.

  2. The Properties bar looks a bit unorganized. The looks can be improved.

  3. The element properties are fixed in number. There should be some way like an Add button for the user to be able to add some more custom properties.

  4. For elements like radio buttons, check boxes and select elements, there is no way to add more than the default number of options.

  5. Compulsary fields should be marked and checked for validity before the form is saved.

  6. For the user's experience to be more effective, some help tips should be added to the wizard. For example, captions or comments while editing the forms.

  7. Names for elements should enable users to understand what the element. For examples, a text area should be named like txtarea1, txtarea2, and so on.

  8. Options for adding Javascript events should be added if possible.

  9. Change of resolutions while editing the form causes some area to fall out of the borders.

Overall, you have done a great job. In some more time, the Form Builder can become very useful and popular.

--
Regards,
Sanket Medhi.

Regards,
Sanket Medhi.

404 on download link

TallDavid's picture

The download link (http://www.islandnet.com/~nedjo/formbuilder.zip) yields a 404 error. Is there an alternate location for the download?

Any Wiki Page?

mrgoltra's picture

Sorry if this post offends anyone. I am a newbie and I would like to know more about this module as far as usage. I am a bit lost.

also, if anyone knows is I can use the form I created to replace the page or other content types for user data submission?

TIA

Mark

Don't worry about being a

jpsalter's picture

Don't worry about being a newbie - we all were at some point.

If you would like to build a form that users will complete and you collect the data - then use the webform.module:
http://drupal.org/project/webform

The AJAX form builder module helps Drupal developers build forms for Drupal modules themselves. If this is not clear or didn't answer your questions - please follow up with more detail.

--Jason

GUI

tjholowaychuk's picture

Is that the current GUI? I downloaded this module atleast a few months ago but if anyone has a copy up and running I would love to see some screenshots, I would defiantly consider helping JS / UI wise on this project.


vision media
350designs

SoC 2006: AJAX Form Builder

Group organizers

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds:

Hot content this week