jQuery and PHP in while loop

Question

My goal is to have a clickable link "view details" inside of the while loop listing all of the "pubs" that will bring up a popup modal that will display pub_details.php?id=x where x is the corresponding id number.

I need assistance on how to pass the id # to jquery, how to make it a "closeable popup modal", and to not have it open until i click "View Details".

Here is my header jQuery code that I am having some problems with..

<script>
$(document).ready(function() {
$.ajax({
    url: "pub_details.php?id=",
    success: function(data){
    $("#content").html(data);
  }   
});

$("#content").dialog(
    {
        bgiframe: true,
        autoOpen: false,
        height: 100,
        modal: true
    }
  );
});
</script>

Here is my code from my index.php page

$q = "SELECT * FROM ".TBL_PUBS." WHERE status = 'Pending' OR status = 'Active' ORDER BY date_created DESC LIMIT 5 ";
$result = $mysql->query($q);
while($row = $result->fetch_object()) {
  echo $row->id;
  echo "<button id='content'>$row->id</button>";
}

Answer 1

Don't use an id for that, use a class. Id's should be unique per page.

Answer 2

See this question: Retrieve Button value with jQuery

Just get the text from you button like this:

$(this).attr("value")

You may need to set the "value" attribute explicitly in your html.