M.Saied Ответов: 1

Блокируйте огонь перед формализацией


иам http://formvalidation использованияконтактная.io для проверки моей формы в asp.net и это прекрасно работает, я пытаюсь использовать blockui http://malsup.com/jquery/block/ чтобы заблокировать страницу на длительном процессе, но она срабатывает, когда кнопка Отправить перед проверкой формы и сохранением страницы заблокирована. как сначала проверить форму, а затем заблокировать страницу при сохранении

<script>
    $(document).ready(function () {
        $('#form1').formValidation({
            framework: 'bootstrap',
            icon: {
                valid: 'fa fa-check',
                invalid: 'fa fa-times',
                validating: 'fa fa-refresh'
            },
            fields: {
               <%=txtName.UniqueID %>: {
                row: '.col-md-4',
                    validators: {
                        notEmpty: {
                            message: 'Name is required'
                        },
                    }
                },
             }
        });
    });   

$(function (e) {
        $('#<%= btnSave.ClientID %>').click(function () {

            if ($('#form1').validate()) {
                $('div.msbl').block({
                    message: '<h5><img src="img/loading.gif" />Loading </h5>',
                });
            }
        });
    });
</script>


Что я уже пробовал:

я пробовал blockui с проверкой jquery и работал нормально, но я хочу использовать его с Лучший плагин проверки jQuery для проверки полей форм, поддержки Bootstrap, Foundation, Pure, SemanticUI, UIKit Framework - FormValidation[^]

1 Ответов

Рейтинг:
1

Nick_3141592654

Вы можете сделать свою модель формы (блокировку) довольно легко, поместив прозрачный div в Z-индекс "выше" формы, сделав все на форме не кликабельным, пока этот div присутствует.

this.blockingObj = document.createElement("DIV");
document.body.appendChild(this.blockingObj);
this.blockingObj.style.background = "transparent";
this.blockingObj.style.zIndex = this.obj.style.zIndex - 1; // Above everything else.
this.blockingObj.style.width = document.documentElement.clientWidth + "px";
this.blockingObj.style.height = document.documentElement.clientHeight + "px";
this.blockingObj.style.position = "relative";
this.blockingObj.style.left = "0px";
this.blockingObj.style.top = "0px";

Конечно, вам нужно удалить этот файл.blockingObj, когда вы хотите снова включить форму.