javascript – When event triggered and page listen to event. The vue data in div will update (Laravel6 & VueJs)-ThrowExceptions

Exception or error:

What I am making is a Queueing System that you usually see in the bank, hospital or any department with queue lines.

What I to do is when I press a button on the dashboard page, My other page(display page) will update its data.

Im trying to make it via Broadcast and listener but I cant make it work.

This is my controller for triggering the event while I press a button

 public function callqueue(Request $request)


        ['called', 'no']
                   ->whereDate('created_at', Carbon::today())
                   ->orderBy('id', 'asc')

                   event(new NewQueue());

                   return redirect('admin')->withStatus(__('Queue has been called.'));


This is my Event (NewQueue)


namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Contracts\Broadcasting\ShouldBroadcastNow;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;
use App\Queue;

class NewQueue implements ShouldBroadcastNow
use Dispatchable, InteractsWithSockets, SerializesModels;

 * Create a new event instance.
 * @return void
public function __construct()


 * Get the channels the event should broadcast on.
 * @return \Illuminate\Broadcasting\Channel|array
public function broadcastOn()
    return new Channel('queues');

This is my script on the other page(Display page)

 const app1 = new Vue({
                isLoading: false,
                isError: false

                    this.isLoading = true;
                    this.isError = false
                        this.isLoading = false

                    .catch(function (error){
                        this.isLoading = false
                        this.isError = true



How can I make it happen that when I press a button on my dashboard page(the one with the callqueue function that will trigger event(new NewQueue()); ) will refresh or update the data on the div in my display page?

I hope someone can help me. Thanks!

How to solve:

Leave a Reply

Your email address will not be published. Required fields are marked *