get the correct value of php variable

Question

this is a stranger question

i have this for cicle

for($i=0;$i<count($certificazioni);$i++){
     $etc=certificazioni[$i];
 ....
    <img src="/cubo/addDocument.png"/ height="24" width="24" data-toggle="modal" data-target="#addEvento">
   }

when i click the image it open a bootstrap modal fade like popup

<div class="modal fade" id="addEvento" tableindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
                <?php echo $etc; ?>

how i can intercept the correct value ? i receive the last value of $etc there is a method to get te correct value of the cicle for ?

Answer 1

you need to use javascript to get the value. I'm not sure what $etc data is, but basically you need to create a javascript function, and pass the value to the function onclick image.

Example:

PHP

for($i=0;$i<count($certificazioni);$i++){
     $etc=certificazioni[$i];
 ....
     ?>
    <img src="/cubo/addDocument.png"/ height="24" width="24" data-toggle="modal" data-target="#addEvento" onclick="return viewImage(<?php echo $etc; ?>)">
    <?php
   }

HTML Modal

Add additional div to the modal code

<div id="outputHere"></div>

JavaScript

<script>
      function viewImage(image) {
        // do what you need with the data, which is in this case to append to the modal

        document.getElementById('outputHere').innerHTML = image;
        // this example is only to append the value. you can modified it to suit your needs (html code or anything)
      }
</script>

Answer 2

I think what you're trying to do is to open a specific modal when an image in clicked and if so, then try this:

for($i=0;$i<count($certificazioni);$i++){
    $etc=certificazioni[$i];
    ....
    <img src="/cubo/addDocument.png"/ height="24" width="24" data-toggle="modal" data-target="#addEvento<?= $i ?>">

    <div class="modal fade" id="addEvento<?= $i ?>" tableindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
            <?php echo $etc; ?>
}

you should include the modal inside the for loop so that every image will have its own modal and when you click image 1 then modal 1 will open.. and you don't even need to use javascript for this.