циклический массив с ключом для модального / div

Question

Я создал список элементов, рядом с которыми есть значок, где я пытаюсь щелкнуть значок, чтобы он заполнил модал, содержащий информацию, и он будет использоваться для удаления / редактирования объектов по мере их добавить к ним.

Проблема в том, что теперь, когда я нажимаю на иконку, кажется, что она вообще не появляется. До того, как я добавил $key, он по крайней мере вызвал модальный режим, но у каждого была информация для первого элемента в массиве. Сейчас я просто пытаюсь добавить ключ к необходимому предмету, чтобы, если я щелкну по значку, я получил модальное сообщение только с информацией об этом предмете.

Что я здесь не так делаю?

@foreach($nodes as $key => $node)   
    <div class="uk-width-1-1">
        <div class="uk-grid ">
            <div class="uk-width-2-6">
            {{$node->id}} - {{$node->name}}
            </div>
            <div class="uk-width-2-6 ">
                <span>{{ $node->comment }}</span> 
                 <a href="#edit-edit-modal{{ $key }}" data-uk-modal><span class="uk-icon-button"></span></a> 
            </div>
        </div>
    </div>
@endforeach


@foreach($nodes as $key => $node)
<div id="edit-edit-modal{{ $key }}" class="uk-modal">  
    <div class="uk-modal-dialog">
            <div class="uk-width-1-1">
                <div class="uk-grid uk-grid-small">
                    <div class="uk-width-2-10">
                    {{$node->id}} - {{$node->name}}
                    </div>
                    <div class="uk-width-2-10 testComment">
                        <span>{{ $node->comment }}</span> 
                    </div>
                </div>
            </div>
    </div>
</div>
@endforeach

Answer 1

Поместите оба div в один foreach

@foreach($nodes as $key => $node)   
<div class="uk-width-1-1">
    <div class="uk-grid ">
        <div class="uk-width-2-6">
        {{$node->id}} - {{$node->name}}
        </div>
        <div class="uk-width-2-6 ">
            <span>{{ $node->comment }}</span> 
             <a href="#edit-edit-modal{{ $key }}" data-uk-modal><span class="uk-icon-button"></span></a> 
        </div>
    </div>
</div>
<div id="edit-edit-modal{{ $key }}" class="uk-modal">  
   <div class="uk-modal-dialog">
        <div class="uk-width-1-1">
            <div class="uk-grid uk-grid-small">
                <div class="uk-width-2-10">
                {{$node->id}} - {{$node->name}}
                </div>
                <div class="uk-width-2-10 testComment">
                    <span>{{ $node->comment }}</span> 
                </div>
            </div>
        </div>
    </div>
 </div>
@endforeach