сбой начальной загрузки не работает, элемент не скрывается

#html #jquery #bootstrap-4 #collapse

#HTML #jquery #bootstrap-4

Вопрос:

Это мой код, и я перепробовал много способов обойти его.

 $('#paired-results').on('show.bs.collapse', function () {

$('.callToAction').collapse('hide');
});

$('#paired-results').on('hide.bs.collapse', function () {
    $('.callToAction').collapse('show');
});
  

………………

 <div id="callToAction" class="row px-2 px-sm-0 mt-4 partners collapse show">
            <form asp-controller="mycontroller" asp-action="myaction" method="post" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-begin="Mymethod">
                <div class="form-group">
                    <div class="container">
                        <div class="row">
                            <div class="col">
                                <label for="email" class="font-weight-bold">Enter the Email address</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col text-danger" id="errormessage" name="errormessage">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="input-group mb-3">
                                    <input type="email" class="form-control rounded-card input font-weight-bold" id="email" name="email" placeholder="Enter Tidepool email" value="@Model.TidepoolEmailAddress" required>
                                </div>
                            </div>
                            <div class="col">
                                <button type="submit" class="btn btn-info tidepool-register-submit" data-toggle="collapse" data-target="#paired-results" aria-controls="errormessage">Link Account</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div id="paired-results" class="collapse">
            <div class="row px-2 px-sm-0 mt-4" id="Result">
                <div class="col-12 text-dark px-0">
                    <div class="w-100 p-3 m-0" id="message"></div>
                </div>
            </div>
        </div>
  

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

Спасибо

Комментарии:

1. Привет, разве ваша страница не обновляется при отправке формы?

Ответ №1:

попробуйте это:

 $('#paired-results').on('show.bs.collapse', function () {
    
    $('.callToAction').hide();
    });
    
    $('#paired-results').on('hide.bs.collapse', function () {
        $('.callToAction').show();
    });
  

Комментарии:

1. Это сработало, но не могли бы вы сказать мне, что не так с моим кодом, пожалуйста? Насколько я знаю, нет никакой разницы между вашим и моим