Update modal dialog for Bootstrap 4

This commit is contained in:
Simon Marsh 2019-01-12 11:22:13 +00:00
parent 8fd7cc13cd
commit 66df1b2230
2 changed files with 20 additions and 14 deletions

View File

@ -51,8 +51,8 @@ $(function(){
event.preventDefault();
link = $(this).attr('href');
$.getJSON(link, function(data) {
$(".modal h3").html(data.title);
$(".modal .modal-body > p").html(data.output);
$(".modal .modal-dialog .modal-content .modal-header .modal-title").html(data.title);
$(".modal .modal-dialog .modal-content .modal-body > p").html(data.output);
$(".modal").modal('show');
});
});

View File

@ -93,19 +93,25 @@
<div class="progress progress-info progress-striped active" style="position:fixed;bottom:0px;right:10px;display:none;height:10px;width:200px;">
<div class="progress-bar" style="width: 100%;"></div>
</div>
<div class="modal fade" style="display:none;">
<div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Modal header</h3>
</div>
<div class="modal-body" style="height: 300px; overflow: auto;">
<p>One fine body…</p>
<h5 class="modal-title">Modal header</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body"><p>One fine body...</p></div>
<div class="modal-footer">
<a href="#" class="btn btn-primary">Close</a>
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="{{url_for('static', filename='js/jquery.js') }}"></script>
<script type="text/javascript" src="{{url_for('static', filename='js/bootstrap.min.js') }}"></script>
<script type="text/javascript" src="{{url_for('static', filename='js/datatables.min.js') }}"></script>