How to show wtform validation error on modal - flask

Question

I have a WTF Form inside a Twitter Bootstrap 3 modal, which I need to validate. The problem is that the modal closes when the user submits the form, even if there are validation errors. If I click on the button that triggers the modal again, the validation error is displayed. So my question is, how do I get the modal to stay open when there are validation errors?
Thanks!
<button type="button" class="btn btn-default" data-toggle="modal" role="dialog" data-target="#save">
<span class="glyphicon glyphicon-flash"></span>
</button>
<div class="modal fade" id="save" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title" id="myModalLabel">Archive List and Start New</h3>
</div>
<form role="form_list" class="form form-medium" action="." method="post">
{{ form_save.csrf_token }}
<div class="modal-body">
<h4>Save list as: </h4>
{{ render_field(form_save.list_name, class="input-large") }}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<a href="#">
<button class="btn btn-success">Archive List</button></a>
</div>
</form>
</div><!-- modal content -->
</div><!-- modal-dialog -->
</div><!-- modal -->
<script src="{{ url_for('static', filename='js/jquery.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>

Answer 1

You should add some javascript to automatically open the modal when there are errors from the form.
Something like (with jQuery):
var formErrors = {% if form_errors %}true{% else %}false{% endif %};
$(document).ready(function() {
if (formErrors) {
$('.modal').modal('show');
}
});