Как закрыть модальное окно при отправке формы?

Question

[RushV]

Всем привет!
Использую модальное окно bootstrap 4
formit, AjaxForm
Есть форма

<form id="orderForm" method="post" action="[[~[[*id]]]]" enctype="multipart/form-data">
<div class="input-group mb-2 border border-warning">
  <div class="input-group-prepend">
  <span class="input-group-text border-danger" id="basic-addon1"><i class="fas fa-user"></i></span>
  </div>
  <input type="text" class="form-control" name="text-name" value="[[+fi.text-name]]" placeholder="Ваше Имя, Наименование организации" aria-label="Ваше Имя, Наименование организации" aria-describedby="basic-addon1">
</div>
<div class="input-group mb-2 border border-warning">
  <div class="input-group-prepend">
  <span class="input-group-text border-danger" id="basic-addon1"><i class="fas fa-envelope"></i></span>
  </div>
  <input type="email" class="form-control" required name="email" value="[[+fi.email]]" placeholder="E-mail" aria-label="E-mail" aria-describedby="basic-addon1">
</div>
<div class="input-group mb-2 border border-warning">
  <div class="input-group-prepend">
  <span class="input-group-text border-danger" id="basic-addon1"><i class="fas fa-phone"></i></span>
  </div>
  <input type="text" class="form-control" name="tel" value="[[+fi.tel]]" placeholder="Контактный телефон" aria-label="Контактный телефон" aria-describedby="basic-addon1">
</div>
<div class="input-group mb-2 border border-warning">
  <div class="input-group-prepend">
  <span class="input-group-text border-danger"><i class="fas fa-marker"></i></span>
  </div>
  <textarea class="form-control" name="text-textarea" aria-label="With textarea" placeholder="Ваше сообщение..."></textarea>
</div>
<div class="form-group mb-2 border">
  <input type="file" class="form-control-file" name="contact_attachment" value="[[!+fi.contact_attachment]]" id="exampleFormControlFile2">
</div>
<div class="text-center mt-4">
 <button type="submit" class="btn bg-orange px-4">Отправить</button>
</div>
</form>

[[!AjaxForm? 
                        &form=`tpl.AjaxFormHeader` 
                        &snippet=`FormIt`
                        &hooks=`email,text`
                        &emailSubject=`Сообщение отправлено с сайта [[++site_name]]`
                        &emailTo=`[e-mail]`
                        &emailFromName=`Технолинк-Сервис`
                        &emailTpl=`email-header-tpl`
                        &validate=`email:email:required`
                        &emailHtml=`1`
                        &validationErrorMessage=`В форме содержатся ошибки!`
                        &successMessage=`Сообщение успешно отправлено`
                      ]]

Answer 1

[Владислав Лысков]

есть событие af_complete, отлавливай его и закрывай модалку

Comments

[RushV]

Я со скриптами не особо на ты.

<script>
  $(document).on('af_complete', function(event, response) {
  var form = response.form;
  if (response.success) {
  response.form.hide();
  $('#success-response').removeClass('d-none');
  $('#myModal').modal('hide');
  }
  });
</script>

закрывает во так

[Владислав Лысков]

RushV, $('#myModal').hide();

[RushV]

Всё сработало, но теперь затемнение осталось .Как правильно написать скрипт?

[Владислав Лысков]

RushV, у тебя bootsrap 4, вот и смотри, как его скрывать https://getbootstrap.com/docs/4.0/components/modal...

[alex-1917]

Владислав Лысков, дыг он же

Я со скриптами не особо на ты.

[Владислав Лысков]

alex-1917, вообще, если его модалка действительно #myModal, а не её body, то его скрипт абсолютно верный