Laravel 5.6 Вернуть неверный идентификатор в foorloop

Question

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

@foreach($packages as $package)
                <div class="modal" tab index="-1" role="dialog"id="deleteModal">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title">Confirmation</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                            <div class="modal-body">
                                <p class="text-center">Are you sure that you want to delete this package information ?</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-danger" data-dismiss="modal">No</button>
                                <a href="{{route('packages.new.delete',$package->id)}}" class="btn btn-success">
                                    Yes
                                </a>
                            </div>
                        </div>
                    </div>
                <div class="card mb-4" style="width: 80%;">
                    <div class="card-header">
                        <div class="row">
                            <div class="col-md-2">
                                <b>User: {{$package->user->name}}</b>
                            </div>

                            <div class="col-md-4">
                                <b>{{$package->created_at}}</b>
                            </div>

                            <div class="col-md-4">
                                <h6><b>#{{$package->packageID}}</b></h6>
                            </div>
                            <div class="col-md-1">
                                <a href="{{route('packages.status',$package->id)}}" class="btn btn-outline-info float-right mr-2">
                                    <i class="fa fa-clock"></i>
                                </a>
                            </div>
                            <div class="col-md-1">
                                <button type="button" class="btn btn-outline-info float-right mr-2"
                                        data-toggle="modal"
                                        data-target="#deleteModal">
                                    <i class="fa fa-trash"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                    <img class="float-left mr-3"  src="{{asset('images/defaultpackage.png')}}" style="width: 10%" alt="Card image cap">
                        <div class="row">
                            <div class="col-md-6">
                                <h5 class="card-title">{{$package->content}}</h5>
                                <p class="card-text text-muted">{{$package->instructions}}</p>
                                <a href="#" class="card-link">Card link</a>
                                <a href="#" class="card-link">Another link</a>
                            </div>

                            <div class="col-md-4">
                                <h5 class="card-title">Warehouse Info</h5>
                                <div class="card-text"><span class="text-muted">Courier Service:</span> <b>   {{$package->cn_courier}} </b><br>
                                    <span class="text-muted">Courier Tracking No.:</span> <b>   {{$package->cn_tracking_no}} <br>
                                        @if($package->pictures == 0 )
                                            <span class="text-muted">Image: No</span> <br>
                                        @elseif($package->pictures == 1)
                                            <span class="text-muted">Images:</span> <b>Yes </b><br>
                                        @endif

                                        <span class="text-muted">Pack:</span> <b>{{$package->pack->name}} <br>
                                            <span class="text-muted">Total Weight:</span>
                                            @if($package->weight == null)
                                                <b>
                                                    Unknown
                                                </b>
                                            @else
                                                {{$package->weight}} kg
                                            @endif
                                        </b>
                                    </b>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
            {{$packages->links()}}

Answer 1

Как вы видите, вы используете цикл для отображения данных и кнопок действий:

Здесь у вас нет уникального идентификатора: id="deleteModal" в модальном

Поместите туда уникальный идентификатор, например: id="deleteModal_'.$package->id.'".

и то же в кнопке также data-target="#deleteModal_'.$package->id.'"

Примечание: идентификатор JS является уникальным, поэтому никогда не используйте его повторно

Answer 2

Вы поместили модальное окно в цикл и произвели несколько модалов.Вместо этого переместите модальное за пределы цикла, чтобы получить один модальный.Цикл для пакетов, чтобы перечислить их (наиболее вероятно, что вы сделали это) и использовать атрибуты данных для идентификатора, имени и т. Д., Как <a data-id="{{ $package->id}}" data-name="{{ $package->name}}">

Далее, добавьте функцию jQuery и используйте идентификатор, имя и т. Д. В модальном,Пример:

$('#deleteModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget)
  var id = button.data('id')
  var name = button.data('name')
  var action = $(this).find('form').attr('action')
  $(this).find('form').attr('action', action + '/' + id)
})

Answer 3

<div class="modal" tab index="-1" role="dialog"id="deleteModal">

Показывает, что вы создаете дубликаты идентификаторов в HTML, сгенерированном из этого цикла.

Идентификаторы должны быть уникальными для каждой страницы.Вам может понадобиться добавить что-то к идентификатору, чтобы сделать каждую из этих карт уникальной.

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

Это, скорее всего, причина «удалений», нацеленных на неправильные элементы HTML.