Creating Dynamic Modal popups with information from job - php

Question

I have a PHP loop that renders results from a Database:
<?php
foreach ($results as $result){
$job_numb = $result['job_numb'];
$job_name = $result['job_name'];
$comments = $result['comments'];
?>
<tr>
<td><?php echo "$job_numb";?> </td>
<td><?php echo "$job_name";?></td>
<td> <button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#Comments-<?php echo $job_numb;?>">Comments</button>
<!-- Modal -->
<div id="Comments-<?php echo $job_numb;?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Comments for <?php echo "$job_name" . "$job_numb";?></h4>
</div>
<div class="modal-body">
<?php echo "$job_name";?>
<?php echo "$comments";?>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</td>
<td>Edit Record</td>
</tr>
<?php
}
?>
The Data target for the modal cannot be a STATIC ID because then it's repeating IDs on the same page - so you will just repeat the same information as the first instance of the ID.
What I am after is to make sure the ID is always different for as many records as there are. I have seen the code before, but I cannot find it now. What am I missing?

Answer 1

Create a unique ID using <?php echo and a unique ID:
<button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#Comments-<?php echo $job_numb;?>">Comments</button>
<div id="Comments-<?php echo $job_numb;?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Comments for <?php echo "$job_name" . " | " . "$job_numb";?></h4>
</div>
<div class="modal-body">
<?php echo "$comments";?>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
Using this, I was able to pass all of that dynamic row's specific data to the modal without ID conflicts. I hope this is useful to others seeking out the answer.