Tuesday, 8 November 2016

How to create a fully functional PHP form and submit data to MySQL with Dreamweaver - CodeBud

Whether you are new to web development or you have moderate knowledge of it, this tutorial will help you to create a fully functional PHP form with Dreamweaver without writing a single line of code.With this post I'm going to show how to make a simple PHP form and submit the form data to MySQL step by step. 
         
     First of all to start developing, all we need to have installed in our computer are:-
  • WampServer
  • MySql
  • Dreamweaver
  • Browser
What is WampServer?
WampServer refers to a software stack for the Microsoft Windows operating system, consisting of the Apache web serverOpenSSL for SSL support, MySQL database and PHP programming language.

Download WampServer from here: 64 Bits and 32 Bits

What is Mysql?
MySQL is an open-source Relational Database Management System. (RDBMS).

Download MySQL from here: 64 Bits and 32 Bits

What is Dreamweaver?

Dreamweaver lets its users design, code and manage websites as well as mobile content.

To download Dreamweaver click here.  

And What can i say about Browser...

After installing WampServer, MySQL and Dreamweaver we are all set to begin our development.


Steps to create the form:-

    • Start Wampserver application.
    • Now start Dreamweaver and click on PHP from the welcome screen.
    To create new PHP page

    • Now Save the newly created page as FORM.php in a specific folder inside C:\wamp\www\
    • Place the cursor after the <body> tag and click on the insert menu from menu bar and select form  option.
Form the dialog box select Method as post and give a name to the form

    • Now place the cursor between the form tags and hit enter.
    • Now go to the design tab and select insert menu from the menu bar and select tables.
    • In the tables dialog box insert number of rows double to the number of form fields you are going to have in your form (For Example: if you willing to create a form with 5 fields, enter number of rows as 11) and keep column field as 1.
In the dialog box enter row numbers and then column number as 1 

    • Now type in your form fields in the rows leaving one blank row in between to make it look cleaner.
    • After typing the field names right click on the rows and click on table and select split cell option.
Click on Table and select Split Cell

Form the dialog box select Columns and Number of columns as 2

    • Now place the cursor in the newly created cell in the row and click on the insert menu in the menu bar and select form and select Text Field from it.
Select text field from insert menu

    • Leave all the fields in the dialog box blank and click OK.
    • Do this for all the fields of your form the same way and then its time to make a submit button.
    • Place the cursor in the last row of the table and click on insert menu in the menu bar and select form option and select button form it.

Click on the Insert menu and select Form and then select Button

    • Leave all the fields in the dialog box blank and click OK.
The PHP form is ready. Now we need to connect the page to mysql to submit data to database.

Before linking the form to database we need to setup your site with Dreamweaver. To set up your site for Dreamweaver, check out my post How To Set Up Your Site In Dreamweaver.

Once Your site is set-up, you can now connect your site to database. But to store data in database you have to create tables to hold data from forms inside the database. To create tables in database, check out my post How to create tables in MySQL database.

After creating table, the only thing left is to connect our site with the database. Connecting and making the PHP  form work is easy. Follow the following steps:-


  1. Click on the + sign in the Database tab in the panel located to the right hand side of your screen.
Click on the + sign and click on MySQL Connection.
     2. In the dialog box fill in the fields as shown in the image below.

Complete the fields as shown in the image and click OK.

Now the next step is to create a recordset.

     1. You can do this by going to the Server Behaviors tab to the right of the Database tab and clicking on the + sign and selecting Recordset.

Click the + sign and select Recordset.
     2.  In the Recordset Dialog Box Give a name to the recordset and select the connection that you created in the previous step and select the table that you created preiously.

Give a Recordset Name, Select the connection name that you created in previous step and select the table you created previuosly andclick OK 


Our Recordset is ready, now we need to define our form to insert the values from form inputs to the database table. To to this, follow these steps:-

    1. From the Serer Behavior tab click on the + sign and select insert record.

Click on the + sign and select Insert Record

     2. Fill in the fields in the dialog bx as shown in the image below.

If you have given a name to your form you'll se that name instead of form[0], select the connection name, select the table name and write the same page name in the last field of the dialog box and then click OK.

So finally a fully functional PHP form is ready. Now you can insert data in the form and save records in database. 

Hope it helped and you all liked this post. I'll also add more posts to my blog soon. Until then, keep learning. :)







No comments:

Post a Comment