laravel - Laravel 返回错误后如何显示 Bootstrap 通知/toast (MDBootstrap)

标签 laravel twitter-bootstrap laravel-5 bootstrap-4 mdbootstrap

我正在做一个 Instagram 风格的小项目,但具有基本功能 使用 Larvel 和 MDBootstrap .

Showing my design

我正在制作表格来编辑个人信息。使用 有效Laravel , 我想当 Laravel 返回表单错误,它在表单页面中显示错误的“Toast 通知”。

这些“toast”通知是通过单击按钮触发的,它们在 HTML 中没有正文,它们可以在您调用它们时使用。

showing "toast notification"

我可以做些什么来检测错误,触发这个“toast”而无需按下按钮?谢谢

最佳答案

我知道如果 Laravel 返回错误,您需要举杯 toast 。
让我提出两个解决方案。
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({})

关于laravel - Laravel 返回错误后如何显示 Bootstrap 通知/toast (MDBootstrap),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54673102/

相关文章:

php - Laravel 5.1 Forge - SQLSTATE[HY000] [1045] 用户 '' @'localhost' 的访问被拒绝(使用密码 : NO))

php - 如何使用 Laravel Eloquent 添加过滤器和分页

javascript - 使用 Vue.js 和 Laravel 设置复选框

php - 为 Laravel 4 RESTful API 身份验证实现 token

css - Bootstrap-tempus-dominus 样式颜色

javascript - AngularJs - 带有ajax加载的模态窗口

php - Laravel - Axois 请求上不存在方法 [orderBy]

css - 使用 Bootstrap 均匀分开单选按钮

提交表单中的 Laravel 日期格式 (d-M-Y)

php - Laravel 5 : ErrorException in LengthAwarePaginator. php:除以零