Skip to content

Instantly share code, notes, and snippets.

@auycro
Last active March 18, 2021 12:16
Show Gist options
  • Save auycro/8ee30b259236592b6c8803ac51c11e2a to your computer and use it in GitHub Desktop.
Save auycro/8ee30b259236592b6c8803ac51c11e2a to your computer and use it in GitHub Desktop.
bootbox example
<html>
<head>
<!-- CSS dependencies -->
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<style media="screen" type="text/css">
.modal {
text-align: center;
padding: 0!important;
}
.modal:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -4px; /* Adjusts for spacing */
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
}
.modal-footer button {
float:right;
margin-left: 10px;
}
</style>
</head>
<body>
<!-- JS dependencies -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>
<script type="text/JavaScript">
function showConfirm(title, locale, confirm_callback){
bootbox.setDefaults({
locale: locale
});
bootbox.confirm({
message: title,
// buttons: {
// confirm: {
// label: 'OK',
// className: 'btn-success'
// },
// cancel: {
// label: 'キャンセル',
// className: 'btn-danger'
// }
// },
callback: confirm_callback,
closeButton: false,
});
}
$('.launchConfirm').on('click', function (e) {
showConfirm('test','ja',function(res){console.log(res);})
});
</script>
<button type="button" class="btn launchConfirm" data-dismiss="modal">Close</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment