Insert Update Delete using PHP MySQLi using Bootstrap | PHP MYSQL crude OPERATION

 Insert Update Delete using PHP MySQLi using Bootstrap, Php insert Update Delete free source code, php crud operation



Lets Learn how to Create Php crud operation using MySQLi and Bootstrap 4  where we are using Bootstrap Model framework  at the end of this post you can download the entire project code.
Lets Understand Step by Step.


Step1: Create MySQL Database 
Open ur Xampp/Wamp Server 
Run PHPMYADMIN

Create Database User as Follow

Use Following Script  copy paste and run in your phpmyadmin 

--
-- Database: `crude`
--
-- --------------------------------------------------------
--
-- Table structure for table `user`
--

CREATE TABLE `user` (
  `eid` int(11) NOT NULL,
  `ename` varchar(30) NOT NULL,
  `designation` varchar(30) NOT NULL,
  `city` varchar(100) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--
-- Dumping data for table `user`
--

INSERT INTO `user` (`eid`, `ename`, `designation`, `city`) VALUES
(1, 'Pitesh', 'Managerrrrrrrrrrrrrrrrrrrrrrrr', 'Pune'),
(2, 'Rakesh', 'Office Staff', 'Ahmednagar'),
(3, 'Ritu', 'Sales', 'Pune'),
(6, 'Nasir Sir', 'Assistant Professor', 'Ahmednagar');

--
-- Indexes for dumped tables
--

--
-- Indexes for table `user`
--
ALTER TABLE `user`
  ADD PRIMARY KEY (`eid`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `user`
--
ALTER TABLE `user`
  MODIFY `eid` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=7;
COMMIT;




Step 2:  Create Database Connection File conn.php



<?php
 $conn = mysqli_connect("localhost","root","","crowd")or
die("Connection failed: " );
?>



Step 3: 
Create Php Page index.php Use Bootstrap 4 for Responsive Web designing 



Use Following Code  index.php

<!DOCTYPE html>
<html>
<head>
<title>Insert Update Delete using PHP/MySQLi using Bootstrap</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body style="background:pink">
<div class="container">
<div style="height:50px;"></div>
<div class="well" style="margin:auto; padding:auto; width:80%;">
<span class="pull-left"><a href="#addnew" data-toggle="modal" class="btn btn-primary"><span class="glyphicon glyphicon-plus"></span> Add New</a></span>
<div style="height:50px;"></div>
<table class="table table-striped table-bordered table-hover" >
<thead style="background-color:green; color:white;">
<th>Employee Name</th>
<th>Designation</th>
<th>City</th>
<th>Edit/Delete</th>
</thead>
<tbody>
<?php
include('conn.php');
$query=mysqli_query($conn,"select * from `user`");
while($row=mysqli_fetch_array($query)){
?>
<tr>
<td><?php echo ucwords($row['ename']); ?></td>
<td><?php echo ucwords($row['designation']); ?></td>
<td><?php echo $row['city']; ?></td>
<td>
<a href="#edit<?php echo $row['eid']; ?>" data-toggle="modal" class="btn btn-warning"><span class="glyphicon glyphicon-edit"></span> Edit</a> || 
<a href="#del<?php echo $row['eid']; ?>" data-toggle="modal" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span> Delete</a>
<?php include('button.php'); ?>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
<span style="font-size:25px; color:blue"><center><strong>Insert Update Delete using PHP/MySQLi  using Bootstrap</strong></center></span>
</div>
<?php include('add_modal.php'); ?>
</div>
</body>
</html>


Lets Write a code using bootstrap model in separate php file add_model.php where user click on create new button then model popup where new user information feeding will be done 



save file add_model.php

<!-- Add New -->
    <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="addnew.php">
<div class="row">
<div class="col-lg-2">
<label class="control-label" style="position:relative; top:7px;">Employee Name:</label>
</div>
<div class="col-lg-10">
<input type="text" class="form-control" name="ename">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-2">
<label class="control-label" style="position:relative; top:7px;">Designation:</label>
</div>
<div class="col-lg-10">
<input type="text" class="form-control" name="designation">
</div>
</div>
<div style="height:10px;"></div>
<div class="row">
<div class="col-lg-2">
<label class="control-label" style="position:relative; top:7px;">City:</label>
</div>
<div class="col-lg-10">
<input type="text" class="form-control" name="city">
</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>





Save Below code as addnew.php 
to insert data from model to database 

<?php
include('conn.php');
$ename=$_POST['ename'];
$designation=$_POST['designation'];
$city=$_POST['city'];
mysqli_query($conn,"insert into user (ename, designation, city) values ('$ename', '$designation', '$city')");
header('location:index.php');
?>



Save Below code as delete.php 
to delete data from  database 

<?php
include('conn.php');
$eid=$_GET['eid'];
mysqli_query($conn,"delete from user where eid='$eid'");
header('location:index.php');

?>

Save Below code as edit.php 
to delete data from  database 


<?php
include('conn.php');
$eid=$_GET['eid'];
$ename=$_POST['ename'];
$designation=$_POST['designation'];
$city=$_POST['city'];
mysqli_query($conn,"update user set ename='$ename', designation='$designation', city='$city' where eid='$eid'");
header('location:index.php');

?>



Click here to download Code

Previous
Next Post »

Display Data Dynamically in Dropdown using Php MySQLi

 Display Data Dynamically in Dropdown using Php MySQLi Display Data Dynamically in Dropdown using Php MySQLi,  php Mysql Dropdown tutorial ,...

Article