如何在 Laravel 中使用模态引导程序制作警报消息？

Question

当我点击模态按钮时是这样的。

<button class="btn btn-danger" name="button" title="Hapus" method="get" data-toggle="modal" data-target="#deleteModal{{$objek->id}}" onclick="javascript: {{url('/admin/objek/'.$objek->id)}}"><i class="fa fa-trash-o fa-lg"></i>
</button>

和我这样的模态。

<div class="modal fade" id="deleteModal{{$objek->id}}" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="exampleModalLabel">Hapus Objek Wisata</h4>
      </div>
      <div class="modal-body">
        <p>
         Hapus data objek wisata dengan nama {{$objek->nama_objek}}?
        </p>
      </div>
      <div class="modal-footer">
        <form class="" action="{{url('/admin/objek', $objek->id)}}" method="post">
          <input type="button" class="btn btn-default" data-dismiss="modal" value="Tidak">
          <input type="hidden" name="_method" value="delete">
          <input type="hidden" name="_token" value="{{ csrf_token() }}">
          <input type="submit" class="btn btn-danger" name="name" value="Hapus">
        </form>
      </div>
    </div>
  </div>
</div>

问题是如何在页面重新加载后显示带有警报消息的模式引导程序？

这样的警报消息，但我想在模态引导程序中进行此操作，就像我单击模态删除按钮时一样。

<script type="text/javascript">alert("Data has been submitted");</script>

感谢您的关注。

Answer 1

您可以使用session data 使模式在页面重新加载时打开。

提交请求后，只需向会话中添加一些变量，如下所示：

return redirect('route')->with('show_modal', true);

在view.blade.php:

<scirpt>
    $(function(){
        var show_modal = "{{ session()->pull('show_modal') }}";

        if(typeof show_modal !== 'undefined' && show_modal) {
            $('#modalId').modal('show');
            // This will open up the modal if the variable is present in session as true
            // OR you can simply show an alert message!
            alert("Data has been submitted");
        }
    });
</script>

希望这会有所帮助！