boot confirm dialog - Free Download Easy Confirm Dialog With Bootstrap - BootConfirm.js

Free Download Easy Confirm Dialog With Bootstrap – BootConfirm.js

Posted on

This time I will share jQuery Plugin and tutorial about Easy Confirm Dialog With Bootstrap – BootConfirm.js, hope it will help you in programming stack.

boot confirm dialog - Free Download Easy Confirm Dialog With Bootstrap - BootConfirm.js
File Size: 17.8 KB
Views Total: 641
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

BootConfirm.js is a tiny and simple-to-use jQuery plugin that creates a Bootstrap based confirm modal to gracefully confirm user actions like submitting a form, deleting an item, etc.

How to use it:

1. Load the BootConfirm.js script in the HTML page. Make sure that you have loaded the latest jQuery library and Bootstrap framework in the document.

1 <link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" />
2 <script src="/path/to/cdn/jquery.slim.min.js"></script>
3 <script src="/path/to/cdn/bootstrap.min.js"></script>
4 <script src="BootConfirm.js"></script>

2. Attach the confirm modal to an action button.

1 <button class="simple">
2   Delete
3 </button>
1 $(".simple").BootConfirm();

3. Customize the confirmation message.

1 $(".simple").BootConfirm({
2   message: 'Are you sure to delete this item?'
3 });

4. Perform an action when you click the OK button.

1 $(".simple").BootConfirm({
2   complete: function(){
3     alert('Confirmed')
4   }
5 });

5. Attach the confirm modal to a form submit button and validate the form using the jQuery Validation plugin.

1 <script src="/path/to/cdn/jquery.validate.min.js"></script>
1 <form action="#">
2   <label for="email">Email address:</label>
3   <input type="email" id="email" />
4   <label for="pwd">Password:</label>
5   <input type="password" id="pwd" />
6   <button type="submit">Submit</button>
7 </form>
1 $(":submit").BootConfirm({
2   validateForm:true
3 });