Home Bootstrap JQuery UI Built Dynamic Modal That Uses Bootstrap | confirm.js

JQuery UI Built Dynamic Modal That Uses Bootstrap | confirm.js

Bootstrap webcodeflow · February 5, 2023 · Comments off

confirm.js is to use confirm modal created using JQuery and Bootstrap. Put events in each custom button in your web application. Easy to implement, saves time.

Requirements

This snippet uses a number of open-source projects to work properly:

[Twitter Bootstrap] – great UI boilerplate for modern web apps
[jQuery] – for javascript events

Must Read: Dynamic CRUD table Data Grid Input JavaScript Plugin | appendGrid

How to make use of it:

1. Load the required Bootstrap 3 framework CSS file into the main section of the web page.

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

2. Download the plugin and load the Confirm.js script after the jQuery javascript library.

<script src="path/to/jquery.min.js"></script>
<script src="path/to/confirm.js"></script>

3. Show the basic confirmation dialog on your web page.

Confirm.show('Confirm title', 'Confirm message');

4. Add a custom button with a callback to the confirmation dialog.

Confirm.show('Confirm Title', 'Confirm Message', {

  // add a save button
  'Save' : {
    'primary' : true,
    'callback' : function()
    {
      Confirm.show('Message', 'You have clicked Save');
    }
  }
});