当按钮在php foreach函数内单击时,通过id显示模态
I have a button inside the foreach
function of php. I have a modal which has an id corresponding to the button clicked. Now, what i want to do is when i click the button it shows the modal by id but the first button only works to show the modal and the other doesn't. what should i do? here is my code...
<?php $count = 0; ?>
<?php foreach ($land_i as $li){ ?>
<?php $count++ ?>
<tr>
<td><?= $li['date_approved'] ?></td>
<td><?= $li['status'] ?></td>
<td><button type="button" class="btn btn-primary" data-toggle="modal" data-target=".modal_<?= $li['lpf_no'] ?><?= $count ?>" data-backdrop="static" data-keyboard="false">Select</button>
</td>
</tr>
<?php } ?>
I try to use count to generate it's unique number from the button. I know it's non-sense because each button has a unique id already. Here's my modal...
<div class="modal fade modal_<?= $li['lpf_no'] ?><?= $count ?>" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">In Progress...</h4>
</div>
<div class="modal-body">
<h4><?= $li['lpf_no'] ?></h4>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
that's it. hopefully there's someone gonna help me this one. Here's another thing... i try to put the modal inside my foreach
function. it works but the modal destroy and the design of the page too. so i prefer to place it outside the foreach function.
The problem is in your data-target
. You append the count on to the end of the data-target
in the loop (data-target=".modal_<?= $li['lpf_no'] ?><?= $count ?>
), along with your modal itself: <div class="modal fade modal_<?= $li['lpf_no'] ?><?= $count ?>
... </div>
. The problem is that $count
does not reflect the current count; the loop has already finished by this point; $count
now only refers to the last item.
Assuming you want a different modal for each item, you will indeed need to output the modals inside of a loop -- I'd actually recommend making use of a second loop for this, so as not to have to worry about things like closing your table:
<table>
<?php $count = 0; ?>
<?php foreach ($land_i as $li) { ?>
<?php $count++ ?>
<tr>
<td><?= $li['date_approved'] ?></td>
<td><?= $li['status'] ?></td>
<td><button type="button" class="btn btn-primary" data-toggle="modal" data-target=".modal_<?= $li['lpf_no'] ?><?= $count ?>" data-backdrop="static" data-keyboard="false">Select</button>
</td>
</tr>
<?php } ?>
</table>
<?php $count = 0; ?>
<?php foreach ($land_i as $li) { ?>
<?php $count++ ?>
<div class="modal fade modal_<?= $li['lpf_no'] ?><?= $count ?>" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
...
</div>
<?php } ?>
This way you will end up with a different modal for each item, and they will all have the correct data-target
reference. It also shouldn't break your formatting due to the closure of the <table>
before starting the second loop.