Блог

 class SampleController extends Controller
{
  public function index()
    {

        $users=User::all();

        return view('progress', ['users'=> $users]);

    }
 

 @foreach($users as $user)
                <div class="card">
                    <div class="card-title">
                        <div class="caption">
                             {{ $user['name'] }}
                        </div>

                        <div class="actions">
                            <div class="btn">
                                <button id="ref">Refresh</button>
                            </div>
                        </div>
                    </div>
                    <div class="card-body" id="{{ $user['id'] }}">
                        <center>
                            <div style=" display:inline; width: 200px; height: 200px;">
                                <input
                                    class="graph"
                                    data-max="{{ $user['goal'] }}"
                                    value= ""
                                />
                            </div>
                        </center>
                    </div>
                </div>
                @endforeach
            </div>
 

Сценарий::

  var pusher = new Pusher('xxxxxxx', {
        cluster: 'ap3',
        encrypted: true
      });


   // Subscribe to the channel we specified in our Laravel Event
        var channel = pusher.subscribe('my-channel');
              channel.bind('App\Events\myEvent', function(data){
              target = data.id;
              value = data.value;
        //Refresh button

         $('#ref').click(function(){
             $.ajax({url: '/api/getId/'   target,
                 success: function(){
                 alert('THe UI is updated'   value);
             $(target).block({
                        message: 'processing',
                        timeout: 20000,

                    });
             $(target).unblock();
              
                }
            });
         });
 

Когда я передаю значение через tinker, как показано ниже,

 event(new AppEventsmyEvent('3',40));

 

Я мог видеть, что конкретная Id(3) информация обновляется с учетом значения 40 .

Цель обновления состоит в том ,что карта должна быть заблокирована на 20 секунд, между тем, если я передам значение через событие для конкретного идентификатора, оно разблокирует карту и обновит карту новым значением.

Проблема в том ,что если у меня 10 карт, работает только кнопка обновления на первой карте, кнопка обновления на остальных картах не работает.

Как я могу заставить кнопку обновления работать на всех картах?

Кто-нибудь может, пожалуйста, помочь? Большое спасибо.