11 Simple Steps to Create CRUD Application in PHP & MySQL

This is simple CRUD Application in PHP & MySQL. In this tutorial, you can learn CRUD operations in PHP & MySQL. CRUD stands for create, read, update and delete. Create means inserting data into database using INSERT SQL statement. Read means reading data from database using SELECT SQL statement. Update means updating records using UPDATE SQL query. Finally, Delete means deleting data from database using DELETE SQL statements.
Here I’m going to create four PHP files, each PHP file is for create, read, update, delete functions. And I’m creating a table with simple columns first_name, last_name, gender, age, email_id.
Using these four files, I’ll insert data into database (C), Reading data from database (R), Updating data in database (U), Deleting data from database (D).
And I’ll name these files in simple terminology
- C – Create : index.php – To insert data into database (INSERT SQL Query).
- R – Read : view.php – To read data from database (SELECT SQL Query).
- U – Update : upate.php – To update data in database (UPDATE SQL Query).
- D – Delete : delete.php – To delete data in database (DELETE SQL Query).
First of all, I’ll show you SQL queries. If you understand these queries, then it is easy for you to write CRUD application.
INSERT SQL Query
INSERT SQL Query is used to INSERT data into database simply by passing column names and data along with table name.
SELECT SQL Query
SELECT SQL Query is used to SELECT data from database by simply passing database table name. And we can filter results by using WHERE clause also. We can re-order them ascending, descending order.
UPDATE SQL Query
UPDATE SQL Query is used to UPDATE data in database by passing column names & values with WHERE clause identfying the row.
DELECT SQL Query
DELETE SQL Query is used to DELETE data from database by simply using WHERE clause to identify row.
1. Creating Database Table
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
CREATE TABLE `crud` ( `id` int(11) NOT NULL, `first_name` varchar(255) NOT NULL, `last_name` varchar(255) NOT NULL, `gender` varchar(255) NOT NULL, `age` varchar(255) NOT NULL, `email_id` varchar(255) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; ALTER TABLE `crud` ADD PRIMARY KEY (`id`); -- -- AUTO_INCREMENT for table `crud` -- ALTER TABLE `crud` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT; |
2. Connecting to Database Table using connect.php file
1 2 3 4 5 6 7 8 9 |
<?php $connection = mysqli_connect('localhost', 'root', 'password'); if (!$connection){ die("Database Connection Failed" . mysqli_error($connection)); } $select_db = mysqli_select_db($connection, 'project'); if (!$select_db){ die("Database Selection Failed" . mysqli_error($connection)); } |
3. Create index.php HTML Form
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
<!DOCTYPE html> <html> <head> <title>Simple CRUD Application - CREATE</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <form method="post" class="form-horizontal col-md-6 col-md-offset-3"> <h2>Create Operation in CRUD Application</h2> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">First Name</label> <div class="col-sm-10"> <input type="text" name="fname" class="form-control" id="input1" placeholder="First Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Last Name</label> <div class="col-sm-10"> <input type="text" name="lname" class="form-control" id="input1" placeholder="Last Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">E-Mail</label> <div class="col-sm-10"> <input type="email" name="email" class="form-control" id="input1" placeholder="E-Mail" /> </div> </div> <div class="form-group" class="radio"> <label for="input1" class="col-sm-2 control-label">Gender</label> <div class="col-sm-10"> <label> <input type="radio" name="gender" id="optionsRadios1" value="male" checked> Male </label> <label> <input type="radio" name="gender" id="optionsRadios1" value="female"> Female </label> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Age</label> <div class="col-sm-10"> <select name="age" class="form-control"> <option>Select Your Age</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> </select> </div> </div> <input type="submit" class="btn btn-primary col-md-2 col-md-offset-10" value="submit" /> </form> </div> </div> </body> </html> |
4. INSERT data into database
First include connect.php file in index.php file using require_once PHP function.
1 |
require_once ('connect.php'); |
Then check POST super global using if condition and isset, empty PHP functions. Then assign form values to variables, while assigning these values to variables use mysqli_real_escape_string function to strip data from input fields.
1 2 3 4 5 6 7 |
if(isset($_POST) & !empty($_POST)){ $fname = mysql_real_escape_string($_POST['fname']); $lname = mysql_real_escape_string($_POST['lname']); $email = mysql_real_escape_string($_POST['email']); $gender = $_POST['gender']; $age = $_POST['age']; } |
Then after assigning these values into variables, write SQL query to insert data into database.
1 |
$CreateSql = "INSERT INTO `crud` (first_name, last_name, email_id, gender, age) VALUES ('$fname', '$lname', '$email', '$gender', '$age')"; |
Execute this INSERT SQL Query using mysqli_query PHP Function. Then assign this to variable res.
1 |
$res = mysqli_query($connection, $CreateSql) or die(mysqli_error($connection)); |
Check this res variables with if condition, if the query is succesfully inserted then display success message in body sections or else display a failure message in body section. I’m using two variable fmsg (failure message) & smsg (success message).
1 2 3 4 5 |
if($res){ $smsg = "Successfully inserted data, Insert New data."; }else{ $fmsg = "Data not inserted, please try again later."; } |
Display these error messages inside body section, add this code above form opening tag.
1 2 |
<?php if(isset($smsg)){ ?><div class="alert alert-success" role="alert"> <?php echo $smsg; ?> </div><?php } ?> <?php if(isset($fmsg)){ ?><div class="alert alert-danger" role="alert"> <?php echo $fmsg; ?> </div><?php } ?> |
5. Create view.php HTML File
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<!DOCTYPE html> <html> <head> <title>Simple CRUD Application - READ Operation</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <h2>Read Operation in CRUD applicaiton</h2> <table class="table "> <thead> <tr> <th>#</th> <th>Full Name</th> <th>E-Mail</th> <th>Age</th> <th>Gender</th> <th>Extras</th> </tr> </thead> <tbody> <tr> <th scope="row">1</th> <td>Vivek Vengala</td> <td>Male</td> <td>28</td> <td> <a href="update.php"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a> <a href="delete.php"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a> </td> </tr> </tbody> </table> </div> </div> </body> </html> |
6. Fetch data from datbase in view.php file
Include connect.php file in view.php file for connecting to database.
1 |
require_once('connect.php'); |
Next to read data from the database, we have to write SQL query that is SELECT SQL Query. Here I’m selecting all the rows from database using table name, I’m not limiting the number of rows to fetch. If you want you can use, but here I don’t have many rows.
1 |
$ReadSql = "SELECT * FROM `crud`"; |
Execute this SELECT SQL Query using mysqli_query PHP function, store this data res variable.
1 |
$res = mysqli_query($connection, $ReadSql); |
Again using while loop, we will fetch the data and echo this data in our HTML data table.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?php while($r = mysqli_fetch_assoc($res)){ ?> <tr> <th scope="row"><?php echo $r['id']; ?></th> <td><?php echo $r['first_name'] . " " . $r['last_name']; ?></td> <td><?php echo $r['email_id']; ?></td> <td><?php echo $r['gender']; ?></td> <td><?php echo $r['age']; ?></td> <td> <a href="update.php?id=<?php echo $r['id']; ?>"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a> <a href="delete.php?id=<?php echo $r['id']; ?>"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a> </td> </tr> <?php } ?> |
7. Create update.php HTML file
For update.php file, I’m going to use same HTML code as index.php file. Because, in UPDATE operation, we will get the data from database for specific row based on id. Then user will edits the value and submits the form, after that script will update the values in database.
In previous file view.php, I’ve already created links for edit.php & delete.php files also passing id values from the database. If anyone clicks on the links, these id’s will be passed on to next file that is edit.php or delete.php files.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
<!DOCTYPE html> <html> <head> <title>Simple CRUD Application - UPDATE Operation</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <form method="post" class="form-horizontal col-md-6 col-md-offset-3"> <h2>UPDATE Operation in CRUD Application</h2> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">First Name</label> <div class="col-sm-10"> <input type="text" name="fname" class="form-control" id="input1" placeholder="First Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Last Name</label> <div class="col-sm-10"> <input type="text" name="lname" class="form-control" id="input1" placeholder="Last Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">E-Mail</label> <div class="col-sm-10"> <input type="email" name="email" class="form-control" id="input1" placeholder="E-Mail" /> </div> </div> <div class="form-group" class="radio"> <label for="input1" class="col-sm-2 control-label">Gender</label> <div class="col-sm-10"> <label> <input type="radio" name="gender" id="optionsRadios1" value="male" checked> Male </label> <label> <input type="radio" name="gender" id="optionsRadios1" value="female"> Female </label> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Age</label> <div class="col-sm-10"> <select name="age" class="form-control"> <option>Select Your Age</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> </select> </div> </div> <input type="submit" class="btn btn-primary col-md-2 col-md-offset-10" value="submit" /> </form> </div> </div> </body> </html> |
8. Fetch data into HTML form from database
Next to fetch data into HTML form, we have to write SELECT SQL Query to get data from database based on the id that we are passing from view.php file.
And also to echo data from database, it is easy for input text fields. But, it is little bit tricky for radio buttons and also select list. I’m going to cover them in this step.
First select the data using id, that we got from GET super global.
1 |
require_once('connect.php'); |
Assign id to id variable using GET superglobal.
1 |
$id = $_GET['id']; |
Write SELECT SQL Query based on id value.
1 |
$SelSql = "SELECT * FROM `crud` WHERE id=$id"; |
Execute this SELECT SQL Query using mysqli_query PHP function. And assign it to res variable.
1 |
$res = mysqli_query($connection, $SelSql); |
Covert this result to associative array using mysqli_fetch_assoc PHP function.
1 |
$r = mysqli_fetch_assoc($res); |
Print this data in input fields, below you can see the code of displaying first_name, last_name & email values in input fields.
To display First name input field value.
1 |
<input type="text" name="fname" class="form-control" id="input1" value="<?php echo $r['first_name']; ?>" placeholder="First Name" /> |
To display Last name input field value.
1 |
<input type="text" name="lname" class="form-control" id="input1" value="<?php echo $r['last_name']; ?>" placeholder="Last Name" /> |
To display Email input field value.
1 |
<input type="email" name="email" class="form-control" id="input1" value="<?php echo $r['email_id']; ?>" placeholder="E-Mail" /> |
To display Gender Radio Input Field value.
To check radio buttons based on value, we need to check the value using if condition. If the value is true, then we will select the radio button. Here is the code.
1 |
<input type="radio" name="gender" id="optionsRadios1" value="male" <?php if($r['gender'] == 'male'){ echo "checked";} ?>> Male |
1 |
<input type="radio" name="gender" id="optionsRadios1" value="female" <?php if($r['gender'] == 'female'){ echo "checked";} ?>> Female |
To display Age Select List Field value.
To select the select list value, we will use code same like radio buttons.
1 2 3 4 5 6 7 8 9 |
<select name="age" class="form-control"> <option>Select Your Age</option> <option value="20" <?php if($r['age'] == '20'){ echo "selected";} ?> >20</option> <option value="21" <?php if($r['age'] == '21'){ echo "selected";} ?> >21</option> <option value="22" <?php if($r['age'] == '22'){ echo "selected";} ?> >22</option> <option value="23" <?php if($r['age'] == '23'){ echo "selected";} ?> >23</option> <option value="24" <?php if($r['age'] == '24'){ echo "selected";} ?> >24</option> <option value="25" <?php if($r['age'] == '25'){ echo "selected";} ?> >25</option> </select> |
9. Update data in database
Next if user submits the form, after editing values. Then the data should be inserted into database. I’m going to write code for this purpose.
Check if post superglobal is set and not empty. If it’s true, then assign the values to variables.
1 2 3 4 5 6 7 |
if(isset($_POST) & !empty($_POST)){ $fname = mysql_real_escape_string($_POST['fname']); $lname = mysql_real_escape_string($_POST['lname']); $email = mysql_real_escape_string($_POST['email']); $gender = $_POST['gender']; $age = $_POST['age']; } |
Then write SQL query to update the data in database. Below is the UPDATE SQL Query.
1 |
$UpdateSql = "UPDATE `crud` SET first_name='$fname', last_name='$lname', gender='$gender', age=$age, email_id='$email' WHERE id=$id"; |
Then execute this SQL query using mysqli_query PHP function. And store it in res variable.
1 |
$res = mysqli_query($connection, $UpdateSql); |
Using res variable, we can check the UPDATE Query is successful or not. If the successfully updated then we will redirect user to view.php file. Otherwise, we will display an error message to user.
1 2 3 4 5 |
if($res){ header('location: view.php'); }else{ $fmsg = "Failed to update data."; } |
After that, we have to display this error message inside body section. Add this below line of code above form opening tag.
1 |
<?php if(isset($fmsg)){ ?><div class="alert alert-danger" role="alert"> <?php echo $fmsg; ?> </div><?php } ?> |
10. Adding Delete Popup window in view.php file
Before deleting record, I want to display a popup message after clicking on delete button. This popup message contains two buttons with some text. If the user clicks delete button record will be deleted from database.
Otherwise, if user clicks on cancel button, delete operation will be canceled.
We have to add this code in view.php file to display popup window.
Add this jQuery file in head section.
1 |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> |
Then add this code in side our while loop after edit icon. Here I’m removing delete icon and making it as button.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<button type="button" class="btn btn-info btn-xs" data-toggle="modal" data-target="#myModal<?php echo $r['id']; ?>">Delete</button> <!-- Modal --> <div class="modal fade" id="myModal<?php echo $r['id']; ?>" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">Delete File</h4> </div> <div class="modal-body"> <p>Are you sure?</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> <a href="delete.php?id=<?php echo $r['id']; ?>"><button type="button" class="btn btn-danger"> Yes..! Delete</button></a> </div> </div> </div> </div> |
11. Delete records from database using delete.php file
Next, after clicking delete button user will be recdirected to delete.php file with id in URL. We will delete recored in delete.php file.
If the record is successfully deleted then we will redirect user to view.php file. Otherwise, we will display an error message to user.
Connect to database using connect.php file, just include this file using require_once PHP function.
1 |
require_once('connect.php'); |
Assign id value to id variable from get superglobal.
1 |
$id = $_GET['id']; |
Write SQL Query to delte data from database.
1 |
$DelSql = "DELETE FROM `crud` WHERE id=$id"; |
Execute this query using mysqli_query PHP function, store this res variable.
1 |
$res = mysqli_query($connection, $DelSql); |
If the result is successful then we will redirect user to view.php file. Otherwise, we will display an error message to user.
1 2 3 4 5 |
if($res){ header('location: view.php'); }else{ echo "Failed to delete"; } |
Till now, we have successfully created CRUD application in PHP & MySQL. If you have any issues let me know through comment form below.
Complete Code of All Files
If you have any problem arranging above pieces of code, you can use this below complete code.
[sociallocker]
SQL code to create Database Table
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
CREATE TABLE `crud` ( `id` int(11) NOT NULL, `first_name` varchar(255) NOT NULL, `last_name` varchar(255) NOT NULL, `gender` varchar(255) NOT NULL, `age` varchar(255) NOT NULL, `email_id` varchar(255) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; ALTER TABLE `crud` ADD PRIMARY KEY (`id`); -- -- AUTO_INCREMENT for table `crud` -- ALTER TABLE `crud` MODIFY `id` int(11) NOT NULL AUTO_INCREMENT; |
index.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 |
<?php require_once ('connect.php'); if(isset($_POST) & !empty($_POST)){ $fname = mysql_real_escape_string($_POST['fname']); $lname = mysql_real_escape_string($_POST['lname']); $email = mysql_real_escape_string($_POST['email']); $gender = $_POST['gender']; $age = $_POST['age']; $CreateSql = "INSERT INTO `crud` (first_name, last_name, email_id, gender, age) VALUES ('$fname', '$lname', '$email', '$gender', '$age')"; $res = mysqli_query($connection, $CreateSql) or die(mysqli_error($connection)); if($res){ $smsg = "Successfully inserted data, Insert New data."; }else{ $fmsg = "Data not inserted, please try again later."; } } ?> <!DOCTYPE html> <html> <head> <title>Simple CRUD Application - CREATE Operation</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <?php if(isset($smsg)){ ?><div class="alert alert-success" role="alert"> <?php echo $smsg; ?> </div><?php } ?> <?php if(isset($fmsg)){ ?><div class="alert alert-danger" role="alert"> <?php echo $fmsg; ?> </div><?php } ?> <form method="post" class="form-horizontal col-md-6 col-md-offset-3"> <h2>Create Operation in CRUD Application</h2> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">First Name</label> <div class="col-sm-10"> <input type="text" name="fname" class="form-control" id="input1" placeholder="First Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Last Name</label> <div class="col-sm-10"> <input type="text" name="lname" class="form-control" id="input1" placeholder="Last Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">E-Mail</label> <div class="col-sm-10"> <input type="email" name="email" class="form-control" id="input1" placeholder="E-Mail" /> </div> </div> <div class="form-group" class="radio"> <label for="input1" class="col-sm-2 control-label">Gender</label> <div class="col-sm-10"> <label> <input type="radio" name="gender" id="optionsRadios1" value="male" checked> Male </label> <label> <input type="radio" name="gender" id="optionsRadios1" value="female"> Female </label> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Age</label> <div class="col-sm-10"> <select name="age" class="form-control"> <option>Select Your Age</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> </select> </div> </div> <input type="submit" class="btn btn-primary col-md-2 col-md-offset-10" value="submit" /> </form> </div> </div> </body> </html> |
view.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 |
<?php require_once('connect.php'); $ReadSql = "SELECT * FROM `crud`"; $res = mysqli_query($connection, $ReadSql); ?> <!DOCTYPE html> <html> <head> <title>Simple CRUD Application - READ Operation</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <h2>Read Operation in CRUD applicaiton</h2> <table class="table "> <thead> <tr> <th>#</th> <th>Full Name</th> <th>E-Mail</th> <th>Age</th> <th>Gender</th> <th>Extras</th> </tr> </thead> <tbody> <?php while($r = mysqli_fetch_assoc($res)){ ?> <tr> <th scope="row"><?php echo $r['id']; ?></th> <td><?php echo $r['first_name'] . " " . $r['last_name']; ?></td> <td><?php echo $r['email_id']; ?></td> <td><?php echo $r['gender']; ?></td> <td><?php echo $r['age']; ?></td> <td> <a href="update.php?id=<?php echo $r['id']; ?>"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a> <button type="button" class="btn btn-info btn-xs" data-toggle="modal" data-target="#myModal<?php echo $r['id']; ?>">Delete</button> <!-- Modal --> <div class="modal fade" id="myModal<?php echo $r['id']; ?>" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">Delete File</h4> </div> <div class="modal-body"> <p>Are you sure?</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> <a href="delete.php?id=<?php echo $r['id']; ?>"><button type="button" class="btn btn-danger"> Yes..! Delete</button></a> </div> </div> </div> </div> </td> </tr> <?php } ?> </tbody> </table> </div> </div> <div id="confirm" class="modal hide fade"> <div class="modal-body"> Are you sure? </div> <div class="modal-footer"> <button type="button" data-dismiss="modal" class="btn">Cancel</button> </div> </div> </body> </html> |
update.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 |
<?php require_once('connect.php'); $id = $_GET['id']; $SelSql = "SELECT * FROM `crud` WHERE id=$id"; $res = mysqli_query($connection, $SelSql); $r = mysqli_fetch_assoc($res); if(isset($_POST) & !empty($_POST)){ $fname = mysql_real_escape_string($_POST['fname']); $lname = mysql_real_escape_string($_POST['lname']); $email = mysql_real_escape_string($_POST['email']); $gender = $_POST['gender']; $age = $_POST['age']; $UpdateSql = "UPDATE `crud` SET first_name='$fname', last_name='$lname', gender='$gender', age=$age, email_id='$email' WHERE id=$id"; $res = mysqli_query($connection, $UpdateSql); if($res){ header('location: view.php'); }else{ $fmsg = "Failed to update data."; } } ?> <!DOCTYPE html> <html> <head> <title>Simple CRUD Application - UPDATE Operation</title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" > <link rel="stylesheet" href="styles.css" > <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <?php if(isset($fmsg)){ ?><div class="alert alert-danger" role="alert"> <?php echo $fmsg; ?> </div><?php } ?> <form method="post" class="form-horizontal col-md-6 col-md-offset-3"> <h2>UPDATE Operation in CRUD Application</h2> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">First Name</label> <div class="col-sm-10"> <input type="text" name="fname" class="form-control" id="input1" value="<?php echo $r['first_name']; ?>" placeholder="First Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Last Name</label> <div class="col-sm-10"> <input type="text" name="lname" class="form-control" id="input1" value="<?php echo $r['last_name']; ?>" placeholder="Last Name" /> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">E-Mail</label> <div class="col-sm-10"> <input type="email" name="email" class="form-control" id="input1" value="<?php echo $r['email_id']; ?>" placeholder="E-Mail" /> </div> </div> <div class="form-group" class="radio"> <label for="input1" class="col-sm-2 control-label">Gender</label> <div class="col-sm-10"> <label> <input type="radio" name="gender" id="optionsRadios1" value="male" <?php if($r['gender'] == 'male'){ echo "checked";} ?>> Male </label> <label> <input type="radio" name="gender" id="optionsRadios1" value="female" <?php if($r['gender'] == 'female'){ echo "checked";} ?>> Female </label> </div> </div> <div class="form-group"> <label for="input1" class="col-sm-2 control-label">Age</label> <div class="col-sm-10"> <select name="age" class="form-control"> <option>Select Your Age</option> <option value="20" <?php if($r['age'] == '20'){ echo "selected";} ?> >20</option> <option value="21" <?php if($r['age'] == '21'){ echo "selected";} ?> >21</option> <option value="22" <?php if($r['age'] == '22'){ echo "selected";} ?> >22</option> <option value="23" <?php if($r['age'] == '23'){ echo "selected";} ?> >23</option> <option value="24" <?php if($r['age'] == '24'){ echo "selected";} ?> >24</option> <option value="25" <?php if($r['age'] == '25'){ echo "selected";} ?> >25</option> </select> </div> </div> <input type="submit" class="btn btn-primary col-md-2 col-md-offset-10" value="submit" /> </form> </div> </div> </body> </html> |
delete.php
1 2 3 4 5 6 7 8 9 10 11 |
<?php require_once('connect.php'); $id = $_GET['id']; $DelSql = "DELETE FROM `crud` WHERE id=$id"; $res = mysqli_query($connection, $DelSql); if($res){ header('location: view.php'); }else{ echo "Failed to delete"; } ?> |