[Solved] How to add Hyperlink on php/html table that displays information from mysql database [closed]

by


You’ll have to use css/javascript to do this.

There are 3 ways: The more easy way is to print all data, but just not displaying it yet until someone clicks the link. For the hyperlink part. In this example I used a ‘span’ element which is styled like a hyperlink.

//place inside your head tag
<style>
.hyperlink-lookalike
{
    text-decoration:underline;
    color:blue;
    cursor:pointer;
}
</style>
<script>
//javascript function to toggle extra animal info
function show_extra_info(id)
{
   var tr = document.getElementById('extra_info_'+id);
   if(tr.style.display=='none')
   {
      tr.style.display='table-row';
   }
   else{
      tr.style.display='none';
   }
}
</script>

//inside the loop
echo '<tr>';
echo '<td colspan='2'><span class="hyperlink-lookalike" onclick="show_extra_info(' . $row['id'] . ')">' . $row['name'] . '</span></td>';
echo '</tr>';
echo '<tr id="extra_info_' . $row['id'] . '" style="display:none;">';
echo '<td>' . $row['cost'] . '</td>';
echo '<td>' . $row['life'] . '</td>';
echo '</tr>';

The second way is, and this one uses a hyperlink, go to a detail view:

echo '<td><a href="http://www.example.com/animaldetailedinfo.php?id=' . $row['id'] . '">' . $row['name'] . '</a></td>';

The third (more advanced) way is to do an AJAX request to get the information and display that in a ‘div’ tag. For that you might want to use a javascript library like jquery. Again if you want it to show up in a popup a hyperlink is not necessary. A span element with an onclick event that fires a javascript function that does the request to the server for more information is easier. 

$.get("http://www.example.com/animaldetailedinfo.php", function( data ) {
  $( "#popupcontainer" ).html( data );
});

3

solved How to add Hyperlink on php/html table that displays information from mysql database [closed]