nethken nethken - 5 months ago 21
jQuery Question

PHP - Delete via confirmation with bootstrap

This is what i want to do i will give you a scenario. If i click the delete button the modal will pop up and ask if you want to delete or not. After clicking ok it will perform the query and delete it to database. Can someone give me ideas how to do it?

this is the picture of my grid.
enter image description here

here is my code.

<?php
include_once('connection.php');
?>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href ="css/bootstrap.min.css">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1">

</head>
<body>
<div class="container">
<table class="table table-bordered">
<thead>
<tr>
<th width="60">ID</th>
<th width="200">Title</th>
<th width="150">Date Posted</th>
<th>Content</th>
<th width="200">Image</th>
<th width="200">Action</th>
</tr>
</thead>
<tbody>
<?php

$stmt = mysqli_prepare($con, "SELECT * FROM news ORDER BY news_id");
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
while($row = mysqli_fetch_array($result)){
?>
<tr>
<td><?php echo $row['news_id']; ?></td>
<td><?php echo $row['news_title']; ?></td>
<td><?php echo $row['news_date']; ?></td>
<td><?php echo $row['news_content']; ?></td>
<td><img style="height:150px; width:200px;" src="<?php echo $row['news_image']; ?>" ></td>
<td>
<a href="edit2.php?newsid=<?php echo $row['news_id'];?>" class='btn btn-info left-margin'><span class="glyphicon glyphicon-edit"></span> Edit</a>
<a class='btn btn-danger delete-object'><span class="glyphicon glyphicon-remove"></span> Delete</a>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>


<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>

</body>
</html>

Answer

You can use Bootstrap dialogs for showing dialogs. When showing a confirmation dialog, you can check if user clicked OK, then do an AJAX request to ex: list.php?delete_photo=31

BootstrapDialog.confirm('Hi Apple, are you sure?', function(result){
            if(result) {
                alert('Yup.');
            }else {
                alert('Nope.');
            }
        });