Using Ajax jQuery Without Refreshing Delete multiple record with checkboxes in PHP Mysqli

Hi, friends in this tutorial I show you how to use Ajax, jQuery without refreshing delete multiple records with checkboxes in PHP Mysql. Using checkbox we can delete multiple records by clicking the checkbox and using delete button for confirmation, then we get a popup message Are you sure to delete? If yes, then the record has been removed from the MySQL database. I have used an Ajax function using this we going to call jQuery. With the help of Ajax delete the record from delete.php. In delete.php we have used SQL query for deleting the record so finally without refreshing using checkbox we removed the record from the web page.
index.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 |
<?php $conn = mysqli_connect("localhost", "root", "", "test") or die(mysqli_error()); $sql = "SELECT * FROM empinfo"; $query = mysqli_query($conn, $sql); ?> <!doctype html> <html> <head> <title>CheckBox Delete | SoftAOX</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.js"></script> </head> <body> <h1 align="center">Using Ajax Jquery Without Refreshing Delete multiple record with checkboxes in PHP Mysqli</h1> <?php if(mysqli_num_rows($query) > 0) { ?> <div align="center"> <table border="1" bordercolor="#00CCCC"> <tr> <th width="40%">First Name</th> <th width="40%">Last Name</th> <th width="20%">Delete</th> </tr> <?php while($row = mysqli_fetch_array($query)) { ?> <tr id="<?php echo $row["id"]; ?>"> <td><?php echo $row["first_name"]; ?></td> <td><?php echo $row["last_name"]; ?></td> <td><input type="checkbox" name="id" value="<?php echo $row["id"]; ?>"></td> </tr> <?php } ?> </table> </div> <?php } ?> <p align="center"> <button type="button" name="delete" id="delete">Delete</button> </p> </body> </html> <script> $(document).ready(function(){ $('#delete').click(function(){ if(confirm("Are you sure to delete?")) { var id = []; $(':checkbox:checked').each(function(i){ id[i] = $(this).val(); }); if(id.length === 0) { alert("Please Select Checkbox"); } else { $.ajax({ url:"delete.php", method: "POST", data:{id:id}, success:function() { for(var i =0; i<id.length; i++) { $('tr#'+id[i]+'').css('background-color', '#ccc'); $('tr#'+id[i]+'').fadeOut('slow'); } } }); } } }); }); </script> |
delete.php
1 2 3 4 5 6 7 8 9 10 11 |
<?php $conn = mysqli_connect("localhost", "root", "", "test"); //DB Connection if(isset($_POST["id"])) { foreach($_POST["id"] as $id) { $sql = "DELETE FROM empinfo WHERE id='".$id."'"; mysqli_query($conn, $sql); } } ?> |
Download
Mraj
Creative Designer & Developer specialist by the spirit and a loving blogger by thoughts. If you have any questions let me drop an email with the article name to the following email id: [email protected]