Подтвердить отправку формы с помощью bootbox.confirm()

У меня есть форма и вы хотите перехватить отправку формы для отображения диалогового окна подтверждения с помощью bootbox.

  • Пользователь вводит некоторые данные
  • Пользователь отправляет сообщения
  • Отображается диалоговое окно подтверждения

Если пользователь нажимает OK, форма должна быть отправлена, если она не должна оставаться на странице.

Я пробовал это:

$('#myForm').submit(function() {
    return bootbox.confirm("Are you sure?");
});

Однако bootbox.confirm() немедленно возвращается, диалог подтверждения снова скрывается.

Затем я заметил, что на bootbox.confirm() есть параметр обратного вызова. Однако, если я позвоню $('#myForm').submit() из обратного вызова, это, очевидно, просто покажет диалог подтверждения.

Итак, каков правильный способ подтверждения подачи формы?

Ответы

Ответ 1

Я только получил эту работу, предотвращая поведение формы по умолчанию, вот решение ниже. Я использую это в списке форм, каждый с кнопкой отправки отправки, и он отлично работает.

<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>

Ответ 2

Как всегда: сразу после того, как вы зададите вопрос, вы сами найдете ответ:-). См. Этот ответ: fooobar.com/questions/236205/... (также обратите внимание на комментарий в ответе).

Адаптированный к моей проблеме, решение выглядит следующим образом:

$('#myForm').submit(function() {
    var currentForm = this;
    bootbox.confirm("Are you sure?", function(result) {
        if (result) {
            currentForm.submit();
        }
    });
});

Ответ 3

Этот код отлично работает для меня...

<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>

Ответ 4

Мое решение

@Html.ActionLink("Delete", "DeleteReport", new { id = item.Id }, new { @class = "btn btn-danger", onclick = String.Format("return ASE.ConfirmAction(this.href, 'Delete {0}?');", item.Name) })

var ASE = {
    ConfirmAction: function (href, text) {
        bootbox.confirm(text, function (result) {
            if (result)
                window.location = href;
        });

        return false;
    }
}

Ответ 5

Вы можете решить эту проблему, передав дополнительные параметры вашему обработчику отправки, используя метод .trigger():

$('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 });
            }
        });
    }
});

При первой отправке формы параметр "подтвержденный" не определен, и отображается диалоговое окно начальной загрузки. Если пользователь подтверждает действие в диалоговом окне, событие отправки снова запускается с дополнительным параметром, и форма отправляется в обычном режиме.