JQuery Delete Confirm Modal using Bootbox Example
We always need ask confirmation for remove items. I mean we always ask before deleting items. So if you need to ask confirm before do something like delete, change status, change value etc as you require. If you want to do with better layout then you have to chooes bootbox.js and if you already use bootstrap then it's very better so, let's see bellow example and use it.
Example:
<html lang="en">
<head>
<title>Delete confirm modal using bootbox example</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<button class="btn btn-danger remove">Delete</button>
<!-- bootbox code -->
<script src="https://raw.githubusercontent.com/makeusabrew/bootbox/gh-pages/bootbox.js"></script>
<script>
$(document).on("click", ".remove", function(e) {
bootbox.confirm("Are you sure you want to delete?", function(result) {
if(result){
console.log('write code of remove item.');
}
});
});
</script>
</body>
</html>
I hope it can help you...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- How to Add Bootstrap 5 in Angular 15?
- Angular 14 Bootstrap 5 Datepicker Example
- Angular 9/8 Bootstrap Collapse Example
- Bootstrap Datepicker Disable Specific Dates Example
- PHP Bootstrap Autocomplete Tokenfield using Ajax Example
- Bootstrap SweetAlert Confirm Dialog Box Model Example
- Bootstrap Fancy Alert Box using SweetAlert Example
- JQuery Bootbox Modal Dialog Prompt Example
- How to Use Collapse Example in Bootstrap?
- How to Add Dialog Box in Bootstrap?
- How to Add Tooltip in Bootstrap?