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:
after data showing When you press on delete link of any row a javascript pop up message will appear like below :
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>
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%;
}