Laravel 5.3 : Auto refresh div when data update with Ajax

Question

I code auto refresh div with ajax every second, but i want auto refresh div just if data change not every second. What the better way?

Javascript

<script>
  setInterval(function(){
   $('#datapinjam').load('/datarealtime');
 }, 30000)
</script>

Blade code

<div class="table-responsive mt-3">
  <table id="basic-datatable" class="table dt-responsive nowrap">
      <thead>
          <tr>
            <th>ID</th>
            <th>Inventaris</th>
            <th>No Handphone</th>
            <th>Mulai</th>
            <th>Selesai</th>
            <th>Tanggal</th>
            <th>Keperluan</th>
            <th>Status</th>
            <th>Action</th>
          </tr>
      </thead>
      <tbody>
          <tr>
            @foreach ($peminjaman as $value)

             ....

          @endforeach
      </tbody>


  </table>

</div>

Controller code

public function realtime()
{
  $data['peminjaman'] = DB::table('data_peminjaman')
                        ->join('inventaris', 'data_peminjaman.id_invetaris', '=', 'inventaris.id')
                        ->orderBy('data_peminjaman.iid','desc')
                        ->paginate(10);
  return view('admin.realtime',$data);                      
}

Answer 1

You should create one function in controller let A and one in client side script let B . The B will probe A after a certain interval. If the data is changed the A will return True otherwise False . B on encountering True from A will call the function on client side responsible for refreshing the div containing ajax call.