Overview
this is a fast way to delete Records from your mysql datebase without loading the page .
this jquery code can Delete a any number of Records with animation fade-out effect using jQuery and Ajax.
How It work?
take a look at Jooria_Delete_0.2.js
(function($) {
$.fn.Jooria_Delete = function(name,message) {
$(this).click(function() {
var id = $(this).attr("id");
var dataString = name +'='+ id ;
var parent = $(this).parent();
if(confirm(message)) {
$.ajax({
type: 'POST',
data: dataString,
success: function() {
parent.fadeOut('slow', function() {$(this).remove();});
}
});
}
return false;
});
};
})(jQuery);
name is the name of the variable that will send to PHP by jQuery Ajax. message is the confirmation messages that will appear when click delete.
usage
how you can use the jQuery script to delete any thing
jQuery
$(function() {
$('.delete').Jooria_Delete('user_id','Sure you want to delete this user!o');
});
we said 'user_id' is the variable that will send server
html
now you shold the delete word in the same tag that contain the user name. why? to delete the user name + delete word row you sould add it like that
<span><a>user name here</a> [<a id='5' class='delete' href='#'>Delete</a>]</span>
Requirements
full exapmle
i made for you full example to explan how it work just download then try it by your localhost
Contents
- index.php
- db.php(Database configuration)
- jquery.js
db.php
<?php
mysql_select_db('users',mysql_connect('localhost','root',''));
?>
Database Table Code
-- -- Table structure for table `users` -- CREATE TABLE IF NOT EXISTS `users` ( `id` int(11) NOT NULL AUTO_INCREMENT, `name` varchar(10) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ; -- -- Dumping data for table `users` -- INSERT INTO `users` (`id`, `name`) VALUES (1, 'jooria'), (2, 'Go'), (3, 'Profeser');
index.php
<head>
<script src="jquery.min.js" type="text/javascript"></script>
<script src="Jooria_Delete_0.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('.delete').Jooria_Delete('id','Sure you want to delete this one?');
});
</script>
</head>
<?php
include ('db.php');
if(isset($_POST['id'])){
mysql_query("delete from users where id='".intval($_POST['id'])."'");
exit;
}
$sql = mysql_query("select * from users order by id asc");
echo "<ul>";
while($Row = mysql_fetch_array($sql)){
extract($Row);
echo "<li>$name [<a id='$id' style='color:#ff0000;' class='delete' href='#'>Delete</a>]</li>n";
}
echo "</ul>";
?>
