$this function with PHP

user_15411535 0
Viewed 44

I have a problem. A have table with some informations, but i want to do, when I click on $this tr (for example second), it shows me all informations from database. But I don’t know, how I do with $this function. Or do you know other way, how should I do it? All info I got from databse with variables, but I don’t know, how I show in the JS modal box over screen. Thank you

<?php
  $i = 0;
while($row = $result->fetch_assoc())
{
  $id=$row['ID'];
  $name=$row['Name'];
  $mail=$row['Email'];
  $subject=$row['Subject'];
  $message=$row['Message'];  
  $date=$row['Date'];
  $ip=$row['IP'];
  $device=$row['Device'];
  $os=$row['OS'];
  $browser=$row['Browser'];
  $finish=$row['Finish'];
  echo 
      '<tr class="trX myBtn" id="'.$i.'">
          <td class="tdX">' . $id . '</td>
          <td class="tdX">' . $name . '</td>
          <td class="tdX">' . $subject . '</td>
          <td class="tdX">' . $date . '</td>
          <div id="panel">
          ID:' . $id . '
          Name:' . $name . '
          Email:' . $mail . '
          Subject:' . $subject . '
          Message:' . $message . '
          Date:' . $date . '
          IP:' . $ip . '
          Mobile:' . $device . '
          OS:' . $os . '
          Browser:' . $browser . '
          Finish:' . $finish . '
        </div>
      </tr>';
   $i++;
   echo $i;

}
echo ' </table>  ';
?>

<script>
 $(document).ready(function(){
 $(".trX").click(function(){
   $(this).$("#panel").slideToggle("slow");
 });
});

var modal = document.getElementById("myModal");

var btn = document.getElementById("<?php echo $i ?>");

var span = document.getElementsByClassName("close")[0];

btn.onclick = function() {
 modal.style.display = "block";
}

span.onclick = function() {
 modal.style.display = "none";
}

window.onclick = function(event) {
 if (event.target == modal) {
   modal.style.display = "none";
 }
}
</script>
html-table this php jquery javascript
1 Answers

Use a class instead of an Id. Add a general selector for your trs then attach an event listener on it. You can also add details on the data-* attribure of your elements inorder to use it.

TR:

<tr class="trX" data-id="<?php echo $someVar; ?>">...</tr>

$(function(){
  
    $('.trX').on('click', function(){
         // you can now use $(this) here regardless of the tr
         var dataId = $(this).data('id');
         alert(dataID);
    })

 
})
user_108941450
Related