Modal button click required - modal-dialog

Question

How do i make my bootstrap-modal not to close when clicking outside the dialog box? since i want to force user to click a button on a modal.
below is an example of my modal from bootstrap
<!-- Approve Modal -->
<div class="modal fade alert-success" id="approvemodal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Approved!</h4>
</div>
<div class="modal-body">
<p>Return to vendor approved. </p>
</div>
<div class="modal-footer">
<button id="approvedone" type="button" class="btn btn-lg btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-ok"> Done</button>
</div>
</div>
</div>
</div>

Answer 1

Given below is modern way of doing it. You can refer this link for further details of the way of creating modal dynamically.
function open_modal() {
BootstrapDialog.show({
title: 'Approved!',
message: 'Return to vendor approved.',
closeByBackdrop: false,
closeByKeyboard: false,
buttons: [{
label: '<span class="glyphicon glyphicon-ok"> Done',
action: function(dialog) {
dialog.close();
}
}]
});
}
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/css/bootstrap-dialog.min.css">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script>
<button onclick="open_modal()" type="button"> Open dialog</button>