Блог

Я пытаюсь отключить кнопку при отправке запроса ajax. единственное, что запускается, это console.log . Я думал, что смогу добиться этого, если использую опцию beforeSubmit в ajax, но ненавязчивый AJAX не дает этой опции. Есть ли какой-нибудь способ, которым я могу этого добиться?

Заранее большое вам спасибо

 
@using (Ajax.BeginForm("OrderDetails",
                       "Checkout",
                       null,
                       new AjaxOptions
                       {
                           HttpMethod = "POST",
                           UpdateTargetId = "Checkout",
                           InsertionMode = InsertionMode.Replace,
                           OnBegin = "disableBtnBegin()",
                           OnSuccess = "disableBtnSuccess()",
                           OnFailure = "disableBtnFailure()",
                           LoadingElementId = "loaderSubmit"
                       },
                       new { id = "OrderDetailsForm" }))
{
    

    <div class="card mb-3">
        <div class="card-body">
            <h3 class="card-title"></h3>
           
            <h3 class="card-title"></h3>
            <div class="form-group">
                <div class="form-check row">
                    <div class="check-bx-wrapper col-12">
                        <div class="input-check">
                         
                        </div>
                    </div>
                </div>
            </div>
            <div id="shippingAddressGroup" class="company-account-form row shipping_address w-100">
               
            </div>
            <div class="col-12">
                <button type="submit" class="btn btn-custom-primary" id="nextStepBtn">
                    <span id="loaderSubmit" class="loader-hidden lds-dual-ring" style="display: none;"></span>
                
                </button>
            </div>
        </div>
    </div>
}


    <script>

        function disableBtnBegin() {

            console.log("on begin");
  
            var nextBtn = $('#nextStepBtn');
        
            nextBtn.prop("disabled", true);

        }


    </script>

 

Я провел тест с тем же кодом, которым вы поделились, который хорошо работает на моей стороне, кнопка может быть отключена, как и ожидалось.

Вы можете проверить фактический HTML-источник этой кнопки в браузере и проверить, установлен ли disabled атрибут.

И вы можете попробовать следующий фрагмент кода, а затем проверить, работает ли он.

 $('#nextStepBtn').attr("disabled", true);
 

Кроме того, пожалуйста, перепроверьте, установили ли вы / включили в свой проект ненавязчивую клиентскую библиотеку ajax jQuery и добавьте ссылку на необходимые библиотеки jQuery.

 <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>