Skip to content

Instantly share code, notes, and snippets.

@sabl0r
Forked from stefket/confirm.js
Created December 11, 2015 08:48
Show Gist options
  • Save sabl0r/e8f37147a2a263f4b860 to your computer and use it in GitHub Desktop.
Save sabl0r/e8f37147a2a263f4b860 to your computer and use it in GitHub Desktop.
JavaScript confirm with magnific popup
var confirmDialog = function(message, headline, cb) {
var dialog = '<div class="dialog confirm mfp-with-anim">';
if (headline) {
dialog += '<h2>' + headline + '</h2>';
}
dialog += '<div class="content"><p>' + message + '</p></div>';
dialog += '<div class="actions">';
dialog += '<button type="button" class="btn btn-default btn-cancel">Abbrechen</button> ';
dialog += '<button type="button" class="btn btn-primary btn-submit">OK</button>';
dialog += '</div>';
dialog += '</div>';
$.magnificPopup.open({
modal: true,
items: {
src: dialog,
type: 'inline'
},
callbacks: {
open: function() {
var $content = $(this.content);
$content.on('click', '.btn-submit', function() {
if (typeof cb == 'function') {
cb();
}
$.magnificPopup.close();
$(document).off('keydown', keydownHandler);
});
$content.on('click', '.btn-cancel', function() {
$.magnificPopup.close();
$(document).off('keydown', keydownHandler);
});
var keydownHandler = function (e) {
if (e.keyCode == 13) {
$content.find('.btn-submit').click();
return false;
} else if (e.keyCode == 27) {
$content.find('.btn-cancel').click();
return false;
}
};
$(document).on('keydown', keydownHandler);
}
}
});
};
@texelate
Copy link

Nice script! :-)

Shouldn't you HTML escape headline and message?

@vEduardovich
Copy link

Thank you!

@xProgrammer-007
Copy link

Hello , how to call it , show a example please . Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment