How to use Event to bind the value in laravel?

Viewed 231

How to get the updates from the Pusher to get the updated time from the server.?

I Use, the html(Blade file) with 3 div's like the below,


                <div id="divId1">0</div>

                <div id="divId2">0</div>

                <div id="divId3">0</div>

The 0in each div is replaced by time() in the Controller.

 public function gettime($id=null)
    {
     $result = time();
     return $result;
     }

In js file

$(document).ready(function(){
 $.ajaxSetup({
     headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

  document.querySelectorAll('*').forEach(function(node) {
    var data = '';
    ajax = $.ajax({
      url: '/getTime/' . node,
      method: 'get',
      success: function(data) {
         //parse the server side response
         console.log(data);
      }
    });
   });
});

 var pusher = new Pusher('xxxxxxxxxxxxxxx', {
        cluster: 'eu',
        encrypted: true
      })
      var channel = pusher.subscribe('time-updated');
   // Binding a function to a Event
     channel.bind('App\Events\TimeUpdated', function(data){
     console.log(data);
 });

Event file

class TimeUpdated implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $timechanged;
    public function __construct($timechanged)
    {
       $this->timechanged = $timechanged;
    }

   
    public function broadcastOn()
    {
        return new Channel('time-updated');
    }
    
}

Routes.php

Route::get('/getTime/{id}', 'App\Http\Controllers\Controller@getTime');

In the Browser, When I pass the URL as www.sample.test/getTime/3

It displays, 1620614613 the time for each div individually.

How to get the updates from the PUSHER to update the time for each div?

Could anyone please help?

0 Answers
Related