Connect, Insert, Update, Delete Data from database using PHP

If you haven't read the Part- 1 of the series of post and you are not getting what's going on in this post than I would recommend you to have a look at the previous post CRUD - PHP - PART-1

In the previous post I showed you the code for connecting to the database using the mysqli_connect() function in PHP.

So far we have... :

We have installed the WAMP/XAMPP server.
We have made the project folder named : MyFirstProject
We have created a Database named : test_db
We have created a Table inside that database named: details
The table contains 5 columns :

id : int (primary key)
first_name : varchar
last_name : varchar
age : int
city : varchar

We created a Connection.php file which had the connection code using the basic mysqli_connect function.
We also created an index.php file which included the Connection.php and

In this post I will show you how to insert the details, entered by user, in the database using the INSERT Query. To do this you will need an HTML form in which the user will enter details like First Name, Last Name, and so on. Basically those details are the ones which correspond to the column in our Database's table .

So first of all we need to create a HTML file and we will code that file in HTML to build up the form.

Create a new file in the project folder and name it insert_form save it as .html file.

Note: You can name your files according to your names also ! Just take care of using them as it for redirection OR form action purposes.

Now create the form as below code:

<html>
<head><title>Insert Details</title></head>
<body>
<center>
<table border="2px"> 
<form name="form1" action="insert.php" method="POST">
<tr>
<td>First Name:</td>
<td><input type="text" name="first_name" placeholder="Enter First Name"/></td>
</tr>

<tr>
<td>Last Name:</td>
<td><input type="text" name="last_name" placeholder="Enter Last Name"/></td>
</tr>

<tr>
<td>Age</td>
<td><input type="text" name="age" placeholder="Enter AGE"/></td>
</tr>

<tr>
<td>City</td>
<td><input type="text" name="city" placeholder="Enter City"/></td>
</tr>

<tr>
<td colspan="2" align="center"><input type="submit" name="submit"></td>
</tr>

</form>
</table>
</body>
</html>

If you are not that much familiar with HTML, than below is the explanation for the above code or else skip to the insertion code.

The table tag is not needed to be explained.
The form tag is used to create an HTML form.

the attributes in it are:
name: this is used to name each form control and the form itself.
action: this attribute is used to inform the form about the action to be taken on the click of submit button or submit action. It can have a relative URL or self submit also. The elements and their values of form will be passed to that file mentioned in that attribute.
method: This tag is used to inform the form about the method in which the details will be submitted to the file mentioned in the action tag.

The input tag is used to add controls like text box check box radio buttons, etc.
At the end the input tag has attribute submit which indicates it as a submit button control, which when clicked submits the form data to the file mentioned in the action attribute of the form tag.

To run your file you can directly open it in browser but when you will write the code for the second file (i.e insert.php), the form data wont be submitted in the database even if both the files are coded correctly! Because the if you open the file directly in the browser and not using the URL http://localhost/MyFirstProject/.. using the WAMP server, than it wont understand PHP and it cannot run that code after the form data is submited.
Hence just to check the view of your file you can directly open it in the browser just for this code. Or else to check the total functionality with the php file, which we will be writing in the next section below, than you should start the server and than access the file using localhost/MyFirstProject URL

Insertion Code

In this section we will write the code for inserting the form data, entered by the user, in the test_db database's details table.

As we have used the method POST in the HTML form file above, we will get the data from the POST variable array and store them in to php variables in the file to insert those values in the database table, Below is the code of that file.
File name insert.php

<?php 
if(isset($_POST))
{
 include("Connection.php");
 $first_name=$_POST['first_name'];
 $last_name=$_POST['last_name'];
 $city=$_POST['city'];
 $age=$_POST['age'];
 
 $query= "INSERT into `details`(`first_name`,`last_name`,`city`,`age`) values('$first_name','$last_name','$city','$age')";
 $result= mysqli_query($conn,$query) or die(mysqli_error($conn));
 
 echo "<script> 
 alert('Data Inserted Successfuly');
        window.location='insert_form.html';
     </script>";
}

?>

Description :

The If statement on line 2 checks wheather the POST array which is passed by the HTML form's POST method is set or not.

The array is passed in the isset method which checks that the variable exists and not null
If the varibale is unset() than the method returns FALSE.
Else the method returns TRUE.

The line 4 includes Connection file which we made in the PART -1 tutorial.
Line 5-8 stores the data passed in the POST array from the HTML form in the PHP variables.

The data is passed using the name attribute of the HTML elements.
Hence to get the data accurately we have to take care of the name attribute of the HTML elements. This is also explained in the PART -1 tutorial.

Line 10 stores the mysql query as a string in the $query variable.
Line 11 fires the query using the mysqli_query() method.
rest of the code below consisit of the JS to give an alert message and than redirect that page to insert_form.html file again.

Update (11/8/2016):
The files containing the code mentioned in this article can be found here on our Github repository

Thanks for reading this article.

Have a happy coding!

Search This Blog

YOUTH WORLD BLOG

Connect, Insert, Update, Delete Data from database using PHP - Part -2

Insertion Code

Description :

Comments

Post a Comment

Popular posts from this blog

Being Indian: Exploring ourselves

Windows phone Wifi connectivity problem.

Create Excel file using Java: Apache POI - PART - 2: Line Chart