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>";
}

Just a note about your html - running <button id='content'> in a loop, if more than one iteration, will result in multiple identical html id='content' attributes. You might want to make that class='content' instead, or use id='content-{$row->id}' to make them unique. — Michael Berkowski
– Michael Berkowski, Commented May 12, 2011 at 2:05
Michael, I updated that button to... <input type="button" value="<?=$row->id?>" class="content"></input> — Greg
– Greg, Commented May 12, 2011 at 19:25

Ryan Olds · Accepted Answer · 2011-05-12 02:02:06Z

2

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

answered May 12, 2011 at 2:02

Ryan Olds

4,84730 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

16 Comments

Greg Over a year ago

meaning in the <button class='$row->id'>$row->id</button>

Ryan Olds Over a year ago

<input type="button" value="$row->id" class="content">$row->id</input> Then setup an on click event, $(".content").click(function() { ... }); , that does the ajax request and opens the dialog.

Greg Over a year ago

I had to make a <div id="content"></div> with the following jquery code.. When I add ?id=8 it brings be to a blank white page, how can I pass the class variable to it? $(".content").click(function() { $("#content").load("pub_details.php?id=8");});

Greg Over a year ago

Made some updates and am almost there... here is my jquery code.. $(".content").click(function() { $(".content").load('pub_details.php').dialog( { modal:true, width:600, height:400}); }); html <input type="button" value="<?=$row->id?>" class="content"></input> My problem is now that it is opening a modal for each of the id's in the while loop. and the modal window is just showing the id # instead of pub_details.php also, how can I pass that variable id to pub_details.php?id=

Ryan Olds Over a year ago

You're going to need to perform an ajax request inside of the onClick and then on 'success' populate the div and open the dialog.

|

Community · Accepted Answer · 2017-05-23 11:47:52Z

1

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.

edited May 23, 2017 at 11:47

CommunityBot

11 silver badge

answered May 12, 2011 at 2:05

James Anderson

27.5k7 gold badges55 silver badges81 bronze badges

Collectives™ on Stack Overflow

jQuery and PHP in while loop

2 Answers 2

16 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

16 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related