Output Looks Like:

this is my livewire class code:

public function addToCart($id)
{
    $this->dispatch('success', ['message' => 'Item Added Your Cart']);
}

here is my master file js

I have used Toaster Notification in Laravel Livewire application, it works good but no message can't display.

<script>
        $(document).ready(function() {
            toastr.options = {
                "progressBar": true,
                "positionClass": "toast-top-right",
                "showDuration": "300",
                "hideDuration": "1000",
                "timeOut": "3000",
                "extendedTimeOut": "1000",
            }
        });

        window.addEventListener('success', event => {
            toastr.success(event.detail.message);
        });

        window.addEventListener('warning', event => {
            toastr.warning(event.detail.message);
        });

        window.addEventListener('error', event => {
            toastr.error(event.detail.message);
        });
    </script>

Output Looks Like:

this is my livewire class code:

public function addToCart($id)
{
    $this->dispatch('success', ['message' => 'Item Added Your Cart']);
}

here is my master file js

I have used Toaster Notification in Laravel Livewire application, it works good but no message can't display.

<script>
        $(document).ready(function() {
            toastr.options = {
                "progressBar": true,
                "positionClass": "toast-top-right",
                "showDuration": "300",
                "hideDuration": "1000",
                "timeOut": "3000",
                "extendedTimeOut": "1000",
            }
        });

        window.addEventListener('success', event => {
            toastr.success(event.detail.message);
        });

        window.addEventListener('warning', event => {
            toastr.warning(event.detail.message);
        });

        window.addEventListener('error', event => {
            toastr.error(event.detail.message);
        });
    </script>

• laravel
• laravel-livewire
• livewire-3

• 1 what happens when you rather display event.detail.message through alert() or console.log()? Are you able to see the message or it is null also? – Olumuyiwa Commented Jan 18 at 20:19
• 1 It looks as if there might be a message present, but the toaster CSS may be limiting the display? Can you inspect the popup element to see the elements behind that area to see if the text is present? – Paul T. Commented Jan 18 at 20:35
• 1 Please change the code image to text data – TUPKAP Commented Jan 19 at 4:52
• @TUPKAP i can replace the images to code. – Md. Shiam Hossain Commented Jan 19 at 14:18
• @PaulT. yes i can inspect. there can't show "toast-message" class. – Md. Shiam Hossain Commented Jan 19 at 14:20

1 Answer 1

Instead of using an array to send the message parameter, use a named argument:

public function addToCart($id)
{
    $this->dispatch('success', message: 'Item Added Your Cart');
}