skip to content
Notes && Anecdotes
A decorative, semi-related stock photo that adds less value than this comment.

jquery confirm modal using bootstrap


This little JavaScript snippet lets you easily decide (from another javascript function) to show a confirm-dialog (Bootstrap), and functions to be executed on cancel/confirm.

 * jQuery confirm modal using bootstrap 3.0 (might work with other, shrug)
 * Usage:
 *   var otherFunction = function(){
 *       funkyDialogBox(
 *           "Will you marry me",
 *           function(){ console.log('She said YES! :D'},
 *           function(){ console.log('She said no :(')
 *       }
 *   }

var funkyDialogBox = function (message, confirmCallback, cancelCallback) {
	var unbind = function () {
		$("#dataConfirmModal").unbind("", wrapperCancel);
	var wrapperConfirm = function () {
		if (typeof confirmCallback !== "undefined") confirmCallback();
	var wrapperCancel = function () {
		if (typeof cancelCallback !== "undefined") cancelCallback();
	if (!$("#dataConfirmModal").length) {
			'<div id="dataConfirmModal" class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true&times;</span></button><h4 class="modal-title">Please Confimt</h4></div><div class="modal-body text-center"><p>Er du sikker?</p></div><div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button><button type="button" id="dataConfirmOK" class="btn btn-primary">Confirm</button></div></div></div></div>'
	$("#dataConfirmModal").modal({ show: true });
	$("#dataConfirmModal").on("", wrapperCancel);

Check it out at

Want one made for submit-buttons, link etc? See