Simple Form Builder Web App using PHP and jQuery with Source Code

Language

Introduction

This is a simple PHP and jQuery Project that allow the users to create a dynamic form. This project is was inspired and works such as Google Forms though this web app has only the basic feature of the said existing application. This project can be used to conduct surveys, online job application forms, and etc.

About the Web Application

This Simple Form Builder Web App has the CRUD (Create, Read, Update, and Delete) Operation for the form. In creating the form, the user can set the form title, description, multiple questions, and a specific type of choice for the answers to questions. This form builder handles 4 different types of input fields for the type of answers/choices which are the paragraph, file input/upload, checkboxes(multiple choice / can select more than 1 in the choices), and radio button (can select only 1 in the choices). After the form has made, the system will provide a link of the form which can the creator/author of the form can share to gather responses. The web application also stores the responses of the users who answered/filled up the form.

Features

  • Create Form
  • View Form
  • Update Form
  • Delete Form
  • View the list of Responses
  • View the user Response
  • Downloadable link for the file uploaded

The Form Builder Web App was Developed using the following

  • PHP
  • jQuery
  • Ajax
  • Bootstrap

Images

Create Form Page

Form Builder

 

Form View

Form View

 

Response View

Response View

 

The source code is free to download and was made for educational purposes only. You may download the source code below and modify it the way you wanted.

How to Run

Requirements

  • Download and Install any local web server such as XAMPP/WAMP. ( PHP version should be at least 7+ )
  • Download the provided source code zip file. (download button is located below)

Installation/Setup

  1. Extract the downloaded source code zip file.
  2. Open your XAMPP/WAMP's Control Panel and start Apache and MySQL.
  3. Copy/Paste the source code folder in your htdocs directory if you are using XAMPP and www directory if you are using WAMP.
  4. Locate the SQL the file inside the database directory in the extracted source code folder. The file is known as form_builder_db.sql
  5. Open a browser and browse the PHPMyAdmin. http://localhost/phpmyadmin
  6. Create new database naming form_builder_db and import the provided SQL file.
  7. Browse the Form Builder Web App. i.e. http://localhost/form_builder

DEMO

That's it! You can now explore the features and functionalities of this Simple Form Builder Web Application that was developed using PHP and jQuery. I hope this will help you with what you are looking for and for your future Web/PHP Projects.

Explore more on this website for more Free Source Codes and Tutorials.

Enjoy Coding :))

Note: Due to the size or complexity of this submission, the author has submitted it as a .zip file to shorten your download time. After downloading it, you will need a program like Winzip to decompress it.

Virus note: All files are scanned once-a-day by SourceCodester.com for viruses, but new viruses come out every day, so no prevention program can catch 100% of them.

FOR YOUR OWN SAFETY, PLEASE:

1. Re-scan downloaded files using your personal virus checker before using it.
2. NEVER, EVER run compiled files (.exe's, .ocx's, .dll's etc.)--only run source code.

Comments

Submitted byDotan Gabay (not verified)on Thu, 07/01/2021 - 02:16

I have a problem. when I choice option on checkbox I don't see the responses . I see always "Enter Option"... I need help to fix it.

The label of checkboxes and radio buttons are editable. It works like the title and question field. Simply click the label and type/enter the label you wanted. Let me know if it still won't work. Thanks

Actually the problem is when we select the answer of checkboxes and radio button , then these answers should save in the database but it's not being saved, in database it shows "Enter Option". For example there are 3 checkboxes red, yellow, green. If i choose red and green these values should be saved in database right but it is not being saved.( in database it shows "Enter Option" not the red, green.)please help me to fix this issues.
Submitted byOliver Ramos (not verified)on Wed, 01/26/2022 - 11:54

I too have problems with the checkboxes since it doesn't register to the database even after changing the options.

Add new comment