Как показать индикатор загрузки во время Ajax запроса?

Нужно показать индикатор загрузки во время Ajax запроса. Само окно, в котором вводятся данные запроса формируется так:

function showFeedback(id) {
        var panelId = 'feedback-modal';
        var updatePanel = $('#' + panelId + ' .modal-body').eq(0);
        var OkMetod = $("#feedback-modal").modal;
        $("#feedback-modal-title").html('Обратный звонок');
        $.ajax({
            type: "POST",
            url: "/Ajax/GetFeedback",
            data: {
                //type: 'Product',
                //id: FirmId
            }
        }).done(function (data) {
            consolelog("done");
            updatePanel.html(data);
            setModalSubmit(panelId, OkMetod, 'hide');
            $("#feedback-modal").modal('show');
            $("#FormID").val(id);
        }).fail(function (data) {
            consolelog("False", data);
        });
    };

Сама функция вызывается по кнопке:

<a id="feedbackButton" href="javascript:showFeedback(2);">Some text</a>

Сама страница, которая формируется:

@model InfoPortal.Domain.Models.FeedBackAntiSpam
<div class="row" style="text-align:left;">
    <div class="col-lg-12">
        <form id="purchaseLotAddForm" asp-area="" asp-controller="Ajax" asp-action="FeedbackCreate" method="post" enctype="multipart/form-data" style="">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>

            <div class="row edit-flex-form">
                <div class="col-lg-12">
                    <input type="hidden" asp-for="Type">
                    <input type="hidden" asp-for="FormID">
                    <div class="form-group row">
                        <div class="col-12">
                            <input asp-for="Name" class="form-control" placeholder="Имя" autocomplete="off">
                            <span asp-validation-for="Name" class="text-danger"></span>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-12">
                            <input asp-for="Phone" class="form-control" placeholder="Номер телефона" type="tel" autocomplete="off">
                            <span asp-validation-for="Phone" class="text-danger"></span>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-12">
                            <input asp-for="Email" class="form-control" placeholder="Email" type="email" autocomplete="off">
                            <span asp-validation-for="Email" class="text-danger"></span>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-12">
                            <textarea asp-for="Description" class="form-control" placeholder="Комментарий" onkeyup="javascript:countmeFB();"></textarea>
                            <span asp-validation-for="Description" class="text-danger"></span>
                        </div>
                    </div>
                    <div class="form-group form-check">
                        <label class="form-check-label">
                            <input asp-for="Confirmation" class="form-check-input" /> Согласен с <a href="/privacy">Политикой конфиденциальности</a> и <a href="/termsofuse">Пользовательским соглашением</a>
                        </label>
                    </div>
                </div>


                <div class="modal-footer" style="width: 100%;">
                    @*<a class="button btn-secondary" asp-controller="Catalog" asp-action="Cart">
                            Отправить
                        </a>*@
                    <button type="submit" name="btSave_f" class="button btn-secondary" id="btnSV" style="margin-right: 20px; @(Model?.Confirmation == true ? "" : "display: none;" )">Отправить</button>
                    <button type="button" name="btCancel" class="button btn-primary" data-dismiss="modal">Отмена</button>
                </div>
            </div>
            @*<div class="form-group text-center">
                    <button type="submit" class="btn btn-primary">Применить фильтр</button>
                </div>*@
        </form>
        
    </div>
</div>

@*Antispam*@
<script type="text/javascript">
    var ct = 0;
    var addCount = document.createElement('input');
    addCount.type = "hidden";
    addCount.id = "PressingCountFeedback";
    addCount.name = "PressingCountFeedback";
    addCount.value = "0";
    document.getElementById('purchaseLotAddForm').appendChild(addCount);
    function countmeFB() {
        document.getElementById('PressingCountFeedback').value = ++ct;

    }
</script>
<script>
    var btSave_f = $('button[name ="btSave_f"]').eq(0);
    var checkboxValidate = $('input[name ="Confirmation"]').eq(0);
    checkboxValidate.change(function () {
        if ($(this).is(':checked')) {
            btSave_f.show();
        }
        else {
            btSave_f.hide();
        }

    });
</script>

Ответы (0 шт):