神不在的星期二
2022-12-09 15:39:46
我想制作一個表格,每行都有一個編輯按鈕。編輯按鈕將呈現一個帶有行加載數據的模式彈出窗口。這是我的 blade.php<div class="card-body"> @foreach($employee_education as $employee_education) <div class="card card-primary card-outline"> <div class="card-header bg-white"> <h5 class="card-title m-0"> {{ $employee_education->degree_title }} </h5> <a href="#" data-toggle="modal" id="education_edit_link" data-target="#education_edit_modal" class="btn btn-primary btn-xs" style="float:right;color:white!important;" > <i class="fas fa-edit"></i> Edit </a> </div> <div class="card-body bg-light"> <table class="table table-hover table-sm table-borderless"> <tbody> <tr> <th>Degree Title</th> <td>{{$employee_education->degree_title}} </td> </tr> <tr> <th>Institute</th> <td>{{$employee_education->institute}} </td> </tr> <tr> <th>Address </th> <td>{{$employee_education->address}} </td> </tr> </tbody> </table> </div> </div> <!-- Modal --> <div class="modal fade" id="education_edit_modal" tabindex="-1" role="dialog" aria-labelledby="connection_detailsLabel" aria-hidden="true" >但是模態每次只顯示第一行數據。如何獲取在我的模態中加載的單擊行數據的數據
2 回答

小怪獸愛吃肉
TA貢獻1852條經驗 獲得超1個贊
發生這種情況是因為您所有的模態框都具有相同的 ID。
您可以輕松地將 employee_education 的 ID 添加為模態的 ID:
您需要調整切換鏈接,將 employee_education->id 附加到以下 id:
<a href="#" data-toggle="modal" id="education_edit_link" data-target="#education_edit_modal{{$employee_education->id}}"...
將相同的 ID 附加到您的模態 ID
<div class="modal fade" id="education_edit_modal{{$employee_education->id}}" ... >
請注意:您正在使用$employee_education as $employee_education
foreach 循環。您可能需要重命名變量,因為它們的名稱相同。

撒科打諢
TA貢獻1934條經驗 獲得超2個贊
成因
如果你檢查DOM
你會發現你有多個模態,因為它每次循環遍歷你的$employee_education
集合時都會渲染一個模態。
這些模態中的每一個都將具有相同的id
屬性,因為您沒有在循環中更改它(即每個模態都有一個 id education_edit_modal
)。
因為 anid
應該是唯一的,所以它會在第一次找到帶有 that 的元素時停止查找id
。這就是為什么它總是包含循環中第一個對象的內容。
解決方案
嘗試在循環之外只渲染一個模式,并使用
data
屬性將數據傳遞給它。這樣效率更高,并且不需要您進行某種動態 ID 生成。
https://getbootstrap.com/docs/4.0/components/modal/#varying-modal-content
添加回答
舉報
0/150
提交
取消