<!DOCTYPE html>
<html>
<head>
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="bootstrap@3.1.1" data-semver="3.1.1" src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="http://rawgithub.com/makeusabrew/bootbox/master/bootbox.js"></script>
<link data-require="bootstrap-css@3.1.1" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<button id="bootbox" class="btn">Open confirm</button>
</body>
</html>
$(document).ready(function() {
$("#bootbox").on("click", function(event) {
bootbox.confirm({
title: "danger - danger - danger",
message: "Your custom message here",
buttons: {
cancel: {
label: "Cancel or something",
className: "btn-default pull-left"
},
confirm: {
label: "Delete or something",
className: "btn-danger pull-right"
}
},
callback: function(result) {
if (result) {
alert("confirm ok");
} else {
alert("confirm cancel");
}
}
});
});
});
/* Styles go here */
body {
padding: 10px;
}