This time I will share jQuery Plugin and tutorial about Lightweight jQuery Confirmation Modal For Bootstrap, hope it will help you in programming stack.
A jQuery plugin which helps you create a Bootstrap modal-based confirmation dialog popup for link redirection and form submission.
How to use it:
1. Download and include the JavaScript file bootstrap.confirm.js
in your Bootstrap & jQuery project.
1 |
< script src = "//code.jquery.com/jquery-1.11.3.min.js" ></ script > |
2 |
< script src = "bootstrap.confirm.js" ></ script > |
2. Display a confirm dialog before submitting an html form.
2 |
< button class = "btn btn-primary" |
5 |
data-message = "Are you sure?" |
3. Display a confirm dialog before opening an external link.
4 |
data-message = "Are you sure?" |
4. Customize the modal template.
1 |
template: '<div class="modal fade" tabindex="-1" role="dialog"><div class="modal-dialog modal-sm"><div class="modal-content"><div class="modal-header bg-{{type}} text-{{type}}"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button><h4 id="mySmall<a href="https://www.jqueryscript.net/tags.php?/Modal/">Modal</a>Label" class="modal-title">{{title}}</h4></div><div class="modal-body">{{message}}</div><div class="modal-footer"><button class="btn btn-default" data-dismiss="modal">Cancel</button><button class="btn btn-{{type}}" data-trigger="confirm">Confirm</button></div></div></div></div>' , |
This awesome jQuery plugin is developed by lenilsondc. For more Advanced Usages, please check the demo page or visit the official website.