Php and javascript with mysql copy button

[PNewCode]

Hello. I have been at this for days. What I have works, however it only works to copy the first entry. If there are 3 entries, they each get the button but all of them will only copy the first one in the list. Does anyone know how I can attach the ID in the database to make each listing independant for the copy information? Here is what I have. Many thanks in advanced.

if(!empty($row["name"])  ){
    echo "<b>Name:</b> " . $row["name"]. " <br>  <b>Song:</b> " . $row["song"]. " <br> <b>Link: </b> ";  ?><a target="_blank"  href='<?php echo $row["band"] ; ?> ' ><?php echo $row["band"]. "</a> <br>  <b>Notes:</b> " . $row["extra"]. "  <br> <a href='deletetoo.php?id=".$row['id']."'><img src='/ppreq/deletebtn.jpg'></a>

<input type='text' value=' Song: " . $row["song"] . " - Link: " . $row["band"] . " ' id='myInput'>

<button onclick='myFunction()'>Copy</button>

 <br>  <br> ________________<br> <br>";
  }

  }
} else {
  echo "0 Songs In Que";
}
$conn->close();
?>

and my javascript

<script>
function myFunction() {
  // Get the text field
  var copyText = document.getElementById("myInput");

  // Select the text field
  copyText.select();
  copyText.setSelectionRange(0, 99999); // For mobile devices

  // Copy the text inside the text field
  navigator.clipboard.writeText(copyText.value);
  
  // Alert the copied text
  alert("Copied the text: " + copyText.value);
}
</script>

 

[mac_gyver]

in general, functions should accept input data as call-time parameter(s), so that they can be reused with different input values.

start by dynamically building the id attribute, incorporating the $row['id'] value (note: you can put php variables directly into an overall double-quoted string without all the extra quotes and concatenation dots) -

id='c_{$row['id']}'

dynamically build the function call with the same value as its call-time parameter -

<button onclick=\"myFunction('c_{$row['id']}')\">Copy</button>

modify the function definition to use the call-time parameter as the id of the element to reference -

function myFunction(id) {
  // Get the text field
  var copyText = document.getElementById(id);

.. the rest of the function code is the same

 

[PNewCode]

mac_Gyver you RULE! Thank you so much. And now I have a better understanding too. Totally makes sense. Thank you so much!