Как показать уведомление Bootstrap / тост (MDBootstrap) после того, как Laravel вернет ошибку - PullRequest
0 голосов
/ 13 февраля 2019

Я делаю небольшой проект в стиле Instagram, но с базовыми функциями с использованием Larvel и MDBootstrap .

Отображение моего дизайна

Я делаю форму для редактирования личной информации.Что допустимо при использовании Laravel , я хочу, чтобы, когда Laravel возвращал ошибку формы, он отображал «Уведомление Toast» об ошибке на странице формы.

Эти «всплывающие» уведомления запускаются нажатием на кнопку, они не имеют тела в HTML, они готовы к использованию при вызове.

с отображением «всплывающего уведомления»

Что я могу сделать, чтобы обнаружить ошибку, вызвать этот «тост», не нажимая кнопку?Спасибо

1 Ответ

0 голосов
/ 13 февраля 2019

Я понимаю, что вам нужно показать тост, если Laravel возвращает ошибку.Позвольте мне предложить два решения.

1.используя toastr

В вашем основном файле шаблона поместите это:

@if (session('error'))
  <script>toastr.error('<?php echo session('error'); ?>')</script>
@endif

И не забудьте поместить это в ваш основной файл js:

$('.toast').toast({
    delay:2000,
    // Other options
});

2.Использование встроенной Bootstrap toast

В вашем основном файле шаблона поместите это:

@if (session('error'))
<div class="toast" role="alert" aria-live="assertive" aria-atomic="true">
  <div class="toast-header">
    <img src="..." class="rounded mr-2" alt="...">
    <strong class="mr-auto">Bootstrap</strong>
    <small class="text-muted">11 mins ago</small>
    <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="toast-body">
    Hello, world! This is a toast message.
  </div>
</div>
@endif

И не забудьте поместить это в ваш основной файл js:

$('.toast').toast({})
...