简体   繁体   中英

Unique button for each row in a table?

I'm trying to create a table populated with data from a database. Each row in the table needs to have a button on the end which has a query string identifying the "artist"'s name and needs to link to content specific to that individual artist. With my current table, the buttons are just repeated and are not individual, and I don't know how to make them query the artist they pertain to.

  <?php


//Query to get artist data
    $result = mysqli_query($con,"SELECT * FROM artist LIMIT 10");
if (!$result) {
    printf("Error: %s\n", mysqli_error($con));
    exit();
}
   
      
      
      
      //show artist data in table
       echo "<table><th>BadNoise Artists</th>";
 while($row = mysqli_fetch_array($result))
          {
          echo "<tr><td>" . $row['FirstName'] . "</td><td>" . $row['LastName'] . "</td><td><button>Get External Content</button></td></tr>" ;
          }
 echo "</table>";
 mysqli_close($con);

    

    
    
?> 

I'm using jQuery to populate the div which will show the content specific to each artist:

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").load("demo_test.txt");
  });
});
</script>

Something like this should do the trick. Store the artist's ID in the ID field of the button and obtain it via Jquery:

<?php

//Query to get artist data
$result = mysqli_query($con,"SELECT * FROM artist LIMIT 10");
if (!$result) {
printf("Error: %s\n", mysqli_error($con));
exit();
}

//show artist data in table
echo "<table><th>BadNoise Artists</th>";
while($row = mysqli_fetch_array($result)){
    echo "<tr><td>" . $row['FirstName'] . "</td><td>" . $row['LastName'] . "</td><td><button id='" . $row['artistId'] . "'>Get External Content</button></td></tr>" ;
}
echo "</table>";
mysqli_close($con);

?> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script>
$(document).ready(function(){
  $("button").click(function(){
    var artistId = $(this).attr('id');
    $("#div1").load("demo_test" + artistId + ".txt");
  });
});
</script>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM