Laravel - Message Toastr, on Error or Invalid Input Fields

Question

I have this message notification when I add, edit, and delete but when the error on the field for example, I leave the textbox empty then the error will pop up, but the error is not a toast it is a div class="alert alert-danger>. Can you help me on how to convert this into toastr?

Here is my error on messages.blade.php

@if(count($errors) > 0)
    @foreach($errors->all() as $error)
        <div class="alert alert-danger">
            {{$error}}
        </div>
     @endforeach
@endif

I have this toastr working on my scripts and success, info are working prettty well, but the error as I said is not working.

<script 
    src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js">
</script>
<script type="text/javascript" 
        src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js">
</script>

<script>
    @if(Session::has('message'))
       var type="{{Session::get('alert-type','info')}}"

        switch(type){
            case 'info':
                toastr.info("{{ Session::get('message') }}");
                break;
            case 'success':
                toastr.success("{{ Session::get('message') }}");
                break;
            case 'warning':
                toastr.warning("{{ Session::get('message') }}");
                break;
            case 'error':
               toastr.error("{{ Session::get('message') }}");
               break;
        }
    @endif
</script>

My controller:

Here is where I return my view when the page is successfully created:

$notification = array(
    'message' => 'Employee Information Created!',
    'alert-type' => 'success'
);
    
return redirect('/admin/employeemaintenance/show')
            ->with( $notification, 'Employee Information Created');

How to solve this?

Answer 1

If you want to toast errors, I think the simplest way might be to swap the alert-danger for a toastr:

<script>
    @if(count($errors) > 0)
        @foreach($errors->all() as $error)
            toastr.error("{{ $error }}");
        @endforeach
    @endif
</script>

You will probably want to setup the toastr to prevent duplicates:

toastr.options = {
    "preventDuplicates": true
}