How to create CRUD Operation using PHP, MySQL and Bootstrap

 How to create CRUD Operation using PHP, MySQL and Bootstrap

In this tutorial, we will introduce step by step creating one CRUD Operation using PHP, MySQL and Bootstrap

In this tutorial, we will introduce step by step creating one CRUD Operation using PHP, MySQL and Bootstrap

Steps:

1. Create a table named employee_basics by running following SQL,

CREATE TABLE `employee_basics`
(`id` int(11) NOT NULL,
`name` varchar(100) NOT NULL,
`gender` varchar(6) NOT NULL,
`address` varchar(255) NOT NULL,
`phone` varchar(50) NOT NULL,
`post` varchar(50) DEFAULT NULL,
PRIMARY KEY (`id`));

2. Create a folder named phpCRUD in htdocs folder.

3. Download the following files and copy in the folder.

jquery.min.js
bootstrap.min.css
bootstrap.min.js
jquery.dataTables.min.css
jquery.dataTables.min.js
bootstrap-filestyle.min.js

4. Create database.php file and add the following code.


<?php
//Create database connection
$mysqli = mysqli_connect("localhost","root","","php_crud");

if (!$mysqli) {

die("Connection error: " . mysqli_connect_error());

}
?>

5. Create index.php file and add the following code.


<!DOCTYPE html>

<html>
<head>

<title>PHP/MySQLi CRUD Operation using Bootstrap/Modal</title>
<script src="jquery.min.js"></script>
<link rel="stylesheet" href="bootstrap.min.css" />
<script src="bootstrap.min.js"></script>
<link rel="stylesheet" href="jquery.dataTables.min.css"></style>
<script type="text/javascript" src="jquery.dataTables.min.js"></script>
<script type="text/javascript" src="bootstrap-filestyle.min.js"> </script>
<link href="fonts.css" rel="stylesheet">
<script>

$(document).ready(function(){
$('#empTable').dataTable();
$('.file-upload').file_upload();
});

</script>
</head>

<body style="margin:20px auto">
<center>
<h2><span style="font-size:25px; color:blue">
Simple CRUD Operation using PHP, MySQL and Bootstrap</span>
</h2></center>

<div class="container">
<br/><br/>
<div class="row header col-sm-12" style="text-align:center;color:green">
<span class="pull-left">
<a href="#addnew" data-toggle="modal" class="btn btn-primary btn-sm">
<span class="glyphicon glyphicon-plus"></span> Add New
</a></span>

<div style="height:50px;"></div>
<table class="table table-striped table-bordered table-responsive table-hover" 
id="empTable" >
<thead>
<th><center>Picture</center></th>
<th><center>Name</center></th>
<th><center>Address</center></th>
<th><center>Phone</center></th>
<th><center>Action</center></th>
</thead>
<tbody>
<?php
include('database.php');
$result=$mysqli->query("select * from employee_basics");
while($row=$result->fetch_assoc()){
$img = "http://localhost/php_crud/profile_images/".$row['id']. ".jpg";
?>
<tr>
<td> <img src='<?php echo $img ?>' height="50px" width="70px" /></td>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['address']; ?></td>
<td><?php echo $row['phone']; ?></td>
<td>
<a href="#detail<?php echo $row['id']; ?>" 
data-toggle="modal" class="btn btn-success btn-sm">
<span class="glyphicon glyphicon-floppy-open">
</span>Detail</a>&nbsp;

<a href="#edit<?php echo $row['id']; ?>" 
data-toggle="modal" class="btn btn-warning btn-sm">
<span class="glyphicon glyphicon-edit">
</span> Edit</a>&nbsp;

<a href="#del<?php echo $row['id']; ?>" 
data-toggle="modal" class="btn btn-danger btn-sm">
<span class="glyphicon glyphicon-trash">
</span> Delete</a>

<!-- include edit modal -->
<?php include('show_detail_modal.php'); ?>
<!-- End -->
<!-- include edit modal -->
<?php include('show_edit_modal.php'); ?>
<!-- End -->
<!-- include delete modal -->
<?php include('show_delete_modal.php'); ?>
<!-- End -->
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
<!-- include insert modal -->
<?php include('show_add_modal.php'); ?>
<!-- End -->
</div>
</body>
</html>

6. Create show_add_modal.php file and add the following code.


<!-- Add New employee-->
<div class="modal fade" id="addnew" tabindex="-1" role="dialog" 
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" 
aria-hidden="true">&times;</button>
<center><h4 class="modal-title" id="myModalLabel">Add New</h4></center>
</div>
<div class="modal-body">
<div class="container-fluid">
<form method="POST" action="insert.php" class="form-horizontal" 
enctype="multipart/form-data" >
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Name:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" name="name">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Gender:</label>
</div>
<div class="col-lg-8">
<select name="gender">
<option>Male</option>
<option>Female</option>
</select>
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Address:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" name="address">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Phone:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" name="phone">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Post:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" name="post">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4">
<label class="control-label" style="position:relative; top:7px;">Profile Image:</label>
</div>
<div class="col-lg-8">
<input type="file" class="filestyle" name="pimage" />
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
<span class="glyphicon glyphicon-remove"></span> Cancel</button>

<button type="submit" class="btn btn-primary">
<span class="glyphicon glyphicon-floppy-disk"></span> Save</a>

</form>
</div>
</div>
</div>
</div>

7. Create show_edit_modal.php file and add the following code.


<!-- Edit Model -->

<div class="modal fade" id="edit<?php echo $row['id']; ?>" tabindex="-1" 
role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" 
aria-hidden="true">&times;</button>
<center><h4 class="modal-title" id="myModalLabel">Edit</h4></center>
</div>
<div class="modal-body">
<?php
$edit=$mysqli->query("select * from employee_basics where id=".$row['id']);
$erow=$edit->fetch_assoc();
?>
<div class="container-fluid">
<form method="POST" action="update.php?id=<?php echo $erow['id']; ?>" 
enctype="multipart/form-data">
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Name:</label>
</div>
<div class="col-lg-8">
<input type="text" name="name" class="form-control" 
value="<?php echo $erow['name']; ?>">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Gender:</label>
</div>
<div class="col-lg-8" align="left">
<select name="gender">
<?php if ($erow['gender']=="Male") {?>
<option selected>Male</option>
<option>Female</option>
<?php }else{ ?>
<option>Male</option>
<option selected>Female</option>
<?php }?>
</select>
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Address:</label>
</div>
<div class="col-lg-8">
<input type="text" name="address" class="form-control" 
value="<?php echo $erow['address']; ?>">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label class="control-label" style="position:relative; top:7px;">Phone:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" name="phone" 
value="<?php echo $erow['phone']; ?>">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label class="control-label" style="position:relative; top:7px;">Post:</label>
</div>
<div class="col-lg-8">
<input type="text" class="form-control" 
name="post" value="<?php echo $erow['post']; ?>">
</div>
</div>
 
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label class="control-label" style="position:relative; top:7px;">Profile Image:
</label>
</div>
 
<div class="col-lg-8">
 
<input type="file" class="filestyle" name="pimage" />
 
</div>
 
</div>
 
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
<span class="glyphicon glyphicon-remove"></span> Cancel</button>
<button type="submit" class="btn btn-warning">
<span class="glyphicon glyphicon-check"></span> Save</button>
</div>
</form>
</div>
</div>
</div>
<!-- /.modal -->

8. Create show_delete_modal.php file and add the following code.


<!-- Delete -->
<div class="modal fade" id="del<?php echo $row['id']; ?>" 
tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" 
aria-hidden="true">&times;</button>
<center><h4 class="modal-title" id="myModalLabel">Delete</h4></center>
</div>
<div class="modal-body">
 
<div class="container-fluid">
<h5><center>Do you want to delete <strong><?php echo $row['name']; ?>?
</strong></center></h5>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
<span class="glyphicon glyphicon-remove"></span> Cancel</button>
<a href="delete.php?id=<?php echo $row['id']; ?>" class="btn btn-danger">
<span class="glyphicon glyphicon-trash"></span> Delete</a>
</div>
 
</div>
</div>
</div>
<!-- /.modal -->

9. Create show_detail_modal.php file and add the following code.


<!-- Detail Model -->
<div class="modal fade" id="detail<?php echo $row['id']; ?>" tabindex="-1" 
role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" 
aria-hidden="true">&times;</button>
<h3> Profile Details </h3>
</div>
<div class="modal-body">
<?php
$edit=$mysqli->query("select * from employee_basics where id=".$row['id']);
$erow=$edit->fetch_assoc();
?>
<div class="container-fluid">
<form method="POST" action="update.php?id=<?php echo $erow['id']; ?>" 
enctype="multipart/form-data">
 
<div class="row">
<div class="col-lg-12" align="center">
<?php $img = "http://localhost/php_crud/profile_images/".$row['id']. ".jpg";?>
<img src='<?php echo $img ?>' height="150px" width="170px" />
 
</div>
 
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Name:</label>
</div>
<div class="col-lg-8" align="left">
<?php echo $erow['name']; ?>
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Gender:</label>
</div>
<div class="col-lg-8" align="left">
<?php echo $erow['gender']; ?>
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label style="position:relative; top:7px;">Address:</label>
</div>
<div class="col-lg-8" align="left">
<?php echo $erow['address']; ?>
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label class="control-label" style="position:relative; top:7px;">Phone:</label>
</div>
<div class="col-lg-8" align="left">
<?php echo $erow['phone']; ?>
</div>
</div>
 
 
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-4" align="left">
<label class="control-label" style="position:relative; top:7px;">Post:</label>
</div>
<div class="col-lg-8" align="left">
<?php echo $erow['post']; ?>
</div>
</div>
 
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"> 
Close</button>
 
</div>
</form>
</div>
</div>
</div>
<!-- /.modal -->



10. Create insert.php file and add the following code.


<?php
include('database.php');
 
$name=$_POST['name'];
$gender=$_POST['gender'];
$address=$_POST['address'];
$phone=$_POST['phone'];
$post=$_POST['post'];
$mysqli->query("insert into employee_basics (name, gender, address,phone,post) 
values ('$name', '$gender', '$address','$phone','$post')");
 
$res = $mysqli->query("select id from employee_basics order by id desc");
$row = $res->fetch_row();
$id = $row[0];
 
// Set a constant
define ("FILEREPOSITORY","profile_images/");
 
// Make sure that the file was POSTed.
if (is_uploaded_file($_FILES['pimage']['tmp_name']))
{
// Was the file a JPEG?
if ($_FILES['pimage']['type'] != "image/jpeg") {
echo "<p>Profile image must be uploaded in JPEG format.</p>";
} else {
 
//$name = $_FILES['classnotes']['name'];
$filename=$id.".jpg";
 
$result = move_uploaded_file($_FILES['pimage']['tmp_name'],FILEREPOSITORY.$filename);
//$result = move_uploaded_file($_FILES['pimg']['tmp_name'],
"http://localhost/php_crud/profile_images/28.jpg");
if ($result == 1) echo "<p>File successfully uploaded.</p>";
else echo "<p>There was a problem uploading the file.</p>";
}
}
header('location:index.php');
?>

11. Create update.php file and add the following code.


<?php
include('database.php');
$id=$_GET['id'];
$name=$_POST['name'];
$gender=$_POST['gender'];
$address=$_POST['address'];
$phone=$_POST['phone'];
$post=$_POST['post'];
 
$mysqli->query("update employee_basics set name='$name', gender='$gender', 
address='$address', phone='$phone', post='$post' where id=$id");
 
 
// Set a constant
define ("FILEREPOSITORY","profile_images/");
 
// Make sure that the file was POSTed.
if (is_uploaded_file($_FILES['pimage']['tmp_name']))
{
// Was the file a JPEG?
if ($_FILES['pimage']['type'] != "image/jpeg") {
echo "<p>Profile image must be uploaded in JPEG format.</p>";
} else {
 
//$name = $_FILES['classnotes']['name'];
$filename=$id.".jpg";
 
unlink(FILEREPOSITORY.$filename);
$result = move_uploaded_file($_FILES['pimage']['tmp_name'],
FILEREPOSITORY.$filename);
//$result = move_uploaded_file($_FILES['pimg']['tmp_name'],
"http://localhost/php_crud/profile_images/28.jpg");
if ($result == 1) echo "<p>File successfully uploaded.</p>";
else echo "<p>There was a problem uploading the file.</p>";
}
}
 
header('location:index.php');
 
?>


12. Create delete.php file and add the following code.


<?php
include('database.php');
$id=$_GET['id'];
$mysqli->query("delete from employee_basics where id=$id");
unlink("profile_images/".$id.".jpg");
header('location:index.php');
?>

Build a Register & Login Form using PHP, HTML, CSS, Bootstrap and MySQL

Build a Register & Login Form using PHP, HTML, CSS, Bootstrap and MySQL

In this tutorial you will learn and build a Responsive PHP Registration & Login Form using PHP, HTML, CSS, Bootstrap and MySQL

Welcome to this video on Responsive PHP User Login and Registration Form with PHP and MySQL From Scratch. In this course you will Learn and build a Responsive PHP Registration & Login Form using PHP, HTML, CSS, Bootstrap and MySQL. After watching this course you will be able to Create your own registration form connected to the MySQL database. In this course will explain step by step from scratch how to build a login system that you can customize it. The course covers all the aspects of HTML, CSS, JavaScript, PHP, MySQL along with Bootstrap Framework to create a real-time registration form. Making a Super Simple Registration System With PHP and MySQL will be easy ans step by step process.

All Code of this video can be found here: https://github.com/pknowledge/useraccounts
https://github.com/pknowledge/userlogin

PhP MySQL Projects

PhP MySQL Projects

Simpliv LLC, a platform for learning and teaching online courses. We basically focus on online learning which helps to learn business concepts, software technology to develop personal and professional goals through video library by recognized industry experts and trainers.

Description
PHP Projects in Urdu is a comprehensive course. It has five PHP projects in Urdu. Each project is created from scratch. You will get source code of each project as well. The list of 5 projects is as under:

Project 1: Find and Replace Application
Project 2: Building an Email Marketing Application
Project 3: Creating a Contact Form
Project 4: Building a Search Engine For Database
Project 5: Building a PHP Quiz Application
As this is an intermediate level course so it has some requisites as well

This is a Urdu/Hindi video course

Who this Course is for:

Anyone who wants to learn Web development
Who wants to become a PHP Developer
Basic knowledge
You must have basic knowledge about PHP and Mysql
You must be able to write HTML and CSS as well
What will you learn
How to Find and Replace Application
How to Build an Email Marketing Application
How to Create a Contact Form
How to Build a Search Engine For Database
How to Build a PHP Quiz Application
To continue:

The Complete PHP MySQL Professional Course with 5 Projects

The Complete PHP MySQL Professional Course with 5 Projects

The Complete PHP MySQL Professional Course with 5 Projects

Description
Have you ever wonder why their are so many PHP Mysql Courses but they offer very little practical skills. Sometimes its difficult for beginners to understand the long project right after learning basics due to lack of practice.Furthermore, big courses just give presentation to projects they never ever let students see their actual content. For example the basic videos, Free starter content etc. However this course is Scam-Free course. Students can watch more than 2 hour of initial content free of cost to decide weather to buy this course or not.

This course is designed in more logical way from easy to complex modules step by step. Here is description of the course

Road Map:

Building Blocks Fundamentals 5 Hour 30 mints of Content

Projects:

Regular Expressions 25 mints
Complete Contact Form + Email 1 Hour of Content
Dynamic Web Pages (Directory Project) 1 Hour of Content
CMS Based Employee Management CRUD 2 Hour + 30 minutes of Content
CMS + Admin Panel with Stunning blog + FREE Bootstrap 4.2.1 12 Hour of Content
This course will focus on all the Fundamentals , Building blocks and Advance Concepts of PHP in complete details which are essentials for beginners. In this Course students will build project after every section to see the real world representation of PHP.

Bonuses:

Getting Started with Bootstrap 4 FrameWork from scratch without using any Bootstrap Template
Latest Bootstrap 4.2.1 Essentials Practically in a Project
Using PHP Sessions in a more sophisticated way and pass information easily on different modules of Project
Full Coding Exercises
Login Logout Admin System
Tips / Tricks
Code Re-usability
Strong Security Techniques on Public Pages
PDO layer for Database Operations
Enhancing UI UX in admin Panel so that the Admin can manage the different Components of CMS / Blog easily
Enhancing UI UX in Public Panel so that the Public / Users can easily interact with the different Functionalities of Blog easily.
Using PHP Sessions in a more sophisticated way and pass information easily on different modules of Project
Login Logout Admin System
URL Tracking
Font Awesome
PHP 5.6 and 7 Supports
Admin Info Update
Now if you want to learn PHP and start your professional career, Take this course now

This course is for complete beginners and for those who want to build projects in PHP.

Who this course is for:

Complete Beginners
PHP Aspirants
Designers who want to Start Back-End Programming
College Students
Basic knowledge
No Knowledge required of PHP. This course will teach students everything about PHP from Scratch
Basic HTML
PC of-course :)
What will you learn
All PHP Fundamentals and Building Blocks with practical implementation in Projects
Form Validation with most Secure way using Regular Expressions
Making web pages dynamic with the variety of PHP Techniques
Employee Management System CRUD Application in PHP From Scartch
Complete CMS ( Content Management System) with Admin-Panel
Getting Started with Bootstrap 4 FrameWork from scratch without using any Bootstrap Template
Using PHP Sessions in a more sophisticated way and pass information easily on different modules of Project
Stunning Blog with Commenting functionality
Powerful Web Forms which will be Free of Hack
Build Professional CRUD
CMS Based Projects
Full Coding Exercises
Login Logout Admin System
Tips / Tricks
Sending Email using PHP
Bootstrap 4.2.1
PDO
URL Tracking
Security Techniques on Public pages
Font Awsome
To continue: