我希望模式以正确的 ID 打开，即在 foreach

Posted 2023-02-24

【中文标题】我希望模式以正确的 ID 打开，即在 foreach

【英文标题】：I want the modal to open with the correct ID i.e. in the foreach

【发布时间】：2020-12-07 16:47:49

【问题描述】：

我有一个问题：我使用foreach 列出了一个数据库集合，其中一个按钮可以在每个集合中打开一个模式。该按钮可以正常工作，但传递给模态的 ID 不能正常工作。如果模态代码在foreach 内，则在所有选项中始终显示第一个ID，如果在foreach 之外，则始终显示最后一个ID。

<div class="row">
    @if ($trainingphases == null)
        <p>null</p>
        @else
        <div class="col-md-6">
            <div class="card mt-1">
                    <div class="card-body">
                        <!-- right control icon --> 
                        @foreach ($trainingphases as $trainingphase) 
                        <div class="accordion" id="accordionRightIcon">
                            
                            <div class="card ">
                                <div class="card-header header-elements-inline">
                                    <h6 class="card-title ul-collapse__icon--size ul-collapse__right-icon mb-0">
                                        <a data-toggle="collapse" class="text-default collapsed" href="#accordion-item-icon-right-!!$trainingphase->id_trainingphases!!"
                                            aria-expanded="false">!! $trainingphase->title !!</a>
                                    </h6>
                                </div>
                                <div id="accordion-item-icon-right-!!$trainingphase->id_trainingphases!!" class="collapse" data-parent="#accordionRightIcon" style="">
                                    <div class="card-body">
                                    <textarea class="ckeditor form-control" placeholder="teste" name="description"> $trainingphase->description </textarea>
                                    </div>                                                                              
                                </div>                                                                        
                                <div class="col-md-2">
                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bd-example-modal-lg">editar !! $trainingphase->title !!</button>
                            </div> 
                            </div>                               
                        </div>  
                                                      
                        @endforeach 
                        <!-- /right control icon -->                            
                    </div>                        
                </div>                   
            </div>                
        @endif
    </div>
         
    <div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                <form method="POST" action=" route('create.trainingphase', array('id_trainings'=>$training->id_trainings)) ">
                    @csrf
                    <h5 class="modal-title" id="exampleModalCenterTitle"><input type="text" class="form-control form-control-rounded" id="title" placeholder="!! $trainingphase->title !!" name="title"></h5>
                        
                </div>
                <div class="modal-body">
                <label for="descriptiom">Descrição</label>
                <textarea class="ckeditor form-control" placeholder="teste" name="description"> $trainingphase->description </textarea> 

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
                </form>
            </div>
        </div>
    </div>

【问题讨论】：

这在逻辑上是正确的，如果你需要正确使用js，当用户点击按钮时，将模态中的id更改为按钮id值

【参考方案1】：

说明

这是 php 中循环的预期行为。

因此，您的代码将从上到下进行评估，并且在您的 @foreach 循环中，您实际上是在脚本范围内重新分配 $trainingphase 的值。

循环完成后，$trainingphase 的值不会取消设置，因此它将是您刚刚循环通过的对象中的最后一个值。

---

解决方案

将模态代码保留在循环之外，并尝试在您用来打开模态的按钮上使用data 属性来将值传递到模态本身。

可在此处找到相关文档：

https://getbootstrap.com/docs/4.0/components/modal/#varying-modal-content