Friday 26 June 2015

PHP Delete Data From MySQL with Confirmation

This tutorial shows you that how to Delete rows From MySql database table and How to set JavaScript Powered Confirmation Message, When you click  or press delete link a confirmation message will appear and make sure to delete the selected data or not from MySql Database table  , When You press yes on confirmed messege it will delete the data if not it will do nothing with the data.

Here i am using following table just for explanation for this tutorial.
database : dbtuts
table       : users 
CREATE DATABASE `dbtuts` ;
CREATE TABLE `dbtuts`.`users` (
`user_id` INT( 10 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`first_name` VARCHAR( 25 ) NOT NULL ,
`last_name` VARCHAR( 25 ) NOT NULL ,
`user_city` VARCHAR( 45 ) NOT NULL
) ENGINE = InnoDB;
I hope you know very well that how to select data from database , so i come to the point.
first of all select the data from database table and display it on page.
Suppose following is the data :

index.php 
<?php
mysql_connect("localhost","root","");
mysql_select_db("dbtuts");
$sql_query="SELECT * FROM users";
$result_set=mysql_query($sql_query);
?>
<table align="center">
    <tr>
    <th>First Name</th>
    <th>Last Name</th>
    <th>City</th>
    <th>Delete</th>
    </tr>
    <?php
 if(mysql_num_rows($result_set)>0)
 {
  while($row=mysql_fetch_row($result_set))
  {
   ?>
            <tr>
            <td><?php echo $row[1]; ?></td>
            <td><?php echo $row[2]; ?></td>
            <td><?php echo $row[3]; ?></td>
            <td align="center"><a href="javascript:delete_id(<?php echo $row[0]; ?>)"><img src="b_drop.png" alt="Delete" /></a></td>
            </tr>
            <?php
  }
 }
 else
 {
  ?>
        <tr>
        <th colspan="4">There's No data found !!!</th>
        </tr>
        <?php
 }
 ?>
 </table>

output:
Delete Data with Javascript Confirmation

after data showing When you press on delete link of any row a javascript pop up message will appear like below :

Delete Data with Javascript Confirmation Message

following is the anchor link that call the below javascript function. 
<a href="javascript:delete_id(<?php echo $row[0]; ?>)">Delete</a>
put the following javascript just above your closing </head> tag
<script type="text/javascript">
function delete_id(id)
{
     if(confirm('Sure To Remove This Record ?'))
     {
        window.location.href='index.php?delete_id='+id;
     }
}
</script>
window.location.href='index.php?delete_id='+id; This javascript object creates the QueryString like index.php?delete_id=any_value
and the rest of work is php if the querystring is set the selected row will be deleted using following php condition.
if(isset($_GET['delete_id']))
{
     $sql_query="DELETE FROM users WHERE user_id=".$_GET['delete_id'];
     mysql_query($sql_query);
     header("Location: index.php");
}

OR
You can do this with the following onclick event by putting this in anchor tag.
<a href="index.php?delete_id=<?php echo $row['id']; ?>" onclick="return confirm('sure to delete !'); " >delete</a>

Conclusion:
I have shown you that how to Delete Records From MySql Database Table Using PHP and Set Javascript For Confirmation.
That's it.
Complete Script.

index.php 
<?php
mysql_connect("localhost","root");
mysql_select_db("dbtuts");
$sql_query="SELECT * FROM users";
$result_set=mysql_query($sql_query);
if(isset($_GET['delete_id']))
{
 $sql_query="DELETE FROM users WHERE user_id=".$_GET['delete_id'];
 mysql_query($sql_query);
 header("Location: index.php");
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PHP Delete Data With Javascript Confirmation - By Cleartuts</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript">
function delete_id(id)
{
 if(confirm('Sure To Remove This Record ?'))
 {
  window.location.href='index.php?delete_id='+id;
 }
}
</script>
</head>
<body>
<center>

<div id="header">
 <div id="content">
    <label>PHP Delete Data With Javascript Confirmation - By Cleartuts</label>
    </div>
</div>
<div id="body">
 <div id="content">
    <table align="center">
    <tr>
    <th>First Name</th>
    <th>Last Name</th>
    <th>City</th>
    <th>Delete</th>
    </tr>
    <?php
 if(mysql_num_rows($result_set)>0)
 {
  while($row=mysql_fetch_row($result_set))
  {
   ?>
            <tr>
            <td><?php echo $row[1]; ?></td>
            <td><?php echo $row[2]; ?></td>
            <td><?php echo $row[3]; ?></td>
            
            <td align="center"><a href="javascript:delete_id(<?php echo $row[0]; ?>)"><img src="b_drop.png" alt="Delete" /></a></td>
            </tr>
            <?php
  }
 }
 else
 {
  ?>
        <tr>
        <th colspan="4">There's No data found !!!</th>
        </tr>
        <?php
 }
 ?>
    </table>
    </div>
</div>

<div id="footer">
 <div id="content">
    <hr /><br/>
    <label>for more tutorials and blog tips visit <a href="http://cleartuts.blogspot.com"> : cleartuts.com</a></label>
    </div>
</div>

</center>
</body>
</html>

style.css 
@charset "utf-8";
/* CSS Document */
*
{
 margin:0;
 padding:0;
}
body
{
 background:#fff;
 font-family:"Courier New", Courier, monospace;
}
#header
{
 width:100%;
 height:50px;
 background:#00a2d1;
 color:#f9f9f9;
 font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
 font-size:35px;
 text-align:center;
}
#body
{
 margin-top:80px;
}
table
{
 width:90%;
 font-family:Tahoma, Geneva, sans-serif;
 font-weight:bolder;
 color:#000;
}
table,td,th
{
 border-collapse:collapse;
 border:solid #d0d0d0 1px;
 padding:20px;
}
#footer
{
 margin-top:100px;
 font-weight:bolder;
 color:#00a2d1;
 font-family:Verdana, Geneva, sans-serif;
 font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
 font-family:"Courier New", Courier, monospace;
 font-size:20px;
}
#footer a
{
 color:#004567;
 text-decoration:none;
}
#footer a:hover
{
 color:brown;
}
#footer hr
{
 width:80%;
}

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)