Confirm

Use Bootstrap's JavaScript confirm plugin to ask for user awareness on clicking a link or submitting a form.

Please note that the modal element is removed right after disappear from screen.

Overview

Things to know when using the confirm helper

  1. The bootstrap version must be greater then or equal to 4.2
  2. If you're building Bootstrap JavaScript from source, make sure Modal plugin is included.
  3. This helper developed and tested under Bootstrap 4.3.1
  4. The modal element will be generated when user click the link or submit the form

Examples

Link

This is the example of confirmation on link. Adding attribute data-toggle="confirm" to an <a> with other attribute for the info to add confirmation on it.

Form

The confirmation can also injected to a <form> element. For this to work, you need to add the confirmation manually by javascript.

Link With JQuery

The jQuery method also work for link instead of data attribute.

Goto iqbalfn.com

Usage

The confirm plugin generate your confirmation modal when it get executed ( click or submit ), via JavaScript or data attribute. For element <form> can only triggered by JavaScript because limitation of event the document can receive from the dom.

Via data attribute

Implementation with data attribute can only be done for <a> element. Set attribute data-toggle="confirm" on a <a> element.

Via JavaScript

Call an element with selector with single line of JavaScript.

Goto iqbalfn.com

Options

Options can be passed via data attribute or JavaScript. For data attributes, append the option name to data-, as in data-title="...", or data-btn-confirm="...".

Name Type Default Description
title string Confirmation The modal element title.
text string Are you sure want to do the action? The modal body text content.
ask boolean false Show the modal confirmation when initilaized.
btnConfirm string Yes Text for confirm button
btnType string primary Button type for confirmation button. Without prefix btn-.
btnCancel string Cancel Text for cancel button