Confirm form submission using bootbox.confirm()
As always: Just after you ask a question, you find the answer yourself :-) . See this answer: https://stackoverflow.com/a/2420806/219187 (also note the comment in the answer).
Adapted to my problem, the solution looks as follows:
$('#myForm').submit(function() {
var currentForm = this;
bootbox.confirm("Are you sure?", function(result) {
if (result) {
currentForm.submit();
}
});
});
This code works perfectly for me...
<script type="text/javascript">
$('#myForm').click(function(e) {
e.preventDefault();
var msg = 'Souhaitez vous vraiment supprimer ce produit ?';
bootbox.confirm(msg, function(result) {
if (result) {
$('#myForm').submit();
}
});
});
</script>
I only got this working by preventing the default form behaviour, here is the solution below. I'm using this in a list of forms, each one with a submit delete button and it works fine.
<script type="text/javascript">
$('form').submit(function(e) {
var currentForm = this;
e.preventDefault();
bootbox.confirm("Are you sure?", function(result) {
if (result) {
currentForm.submit();
}
});
});
</script>
You can a solve this by passing additional parameters to your submit handler using the .trigger() method:
$('form').submit(function (e, confirmed) {
var currentForm = $(e.currentTarget);
if (!confirmed) {
e.preventDefault();
bootbox.confirm("Are you sure?", function (result) {
if (result) {
currentForm.trigger('submit', { confirmed: true });
}
});
}
});
When the form is first submitted, the 'confirmed' parameter is undefined and the bootbox dialog is displayed. If the user confirms the action in the dialog, submit event is triggered again with the additional parameter and the form is submitted normally.