How can you use PHP to fetch data from a database using data already returned from the database?

Question

My goal: Use JQuery and PHP to retrieve a list of words from a MySQL database, and then use data (i.e., the id of each word in that list) outputted from that list (in the form of buttons) to pull a second list of words from the database.

JavaScript code for retrieving first list of words from database:

$('#myButton').click(function() {
   var myData = $('#myButton').val();
   // Pass data to PHP script w/ JQuery AJAX function
   $.post("mydata.php", { buttonID: myData }, function(data) {
      $('pageSection').append(data);
   }
   $('pageSection').empty();
});

PHP code to return first list of words from database (simplified to focus on important details):

// Connect to and select database
// Execute SQL query 
// Fetch data
while($row = mysqli_fetch_assoc($result)) {
   $id = $row["id"]
   // Return output
   echo "<button class=\"entry\" value=\"$id\">" . $row["word"] . "</button>";
}

JavaScript code for using output from database to retrieve second list of words:

$('#pageSection').on('click', '.entry', function () {
   // Capture data from value property of each outputted PHP button
   var value = $('.entry').val();
   // Pass value to PHP through AJAX 
});

Problem: I expect the value for each value attribute of each button to return the corresponding id. That is, the id that corresponds to each word in the database. I don't have any problem retrieving the id. I can output it in another format, but I cannot get the right id for each value. I want to get these results:

Expected results:

<button value="id1">Word 1</button>
<button value="id2">Word 2</button>
<button value="id3">Word 3</button>

Instead I get this:

Actual results:

<button value="id1">Word 1</button>
<button value="id1">Word 2</button>
<button value="id1">Word 3</button>

Key question: Is there a way to return buttons generated in PHP so that the value attributes of each button recognize each unique value returned from the database?

Matt · Accepted Answer · 2013-08-30 21:35:56Z

This is related to your jQuery, not PHP. PHP is actually outputting:

<button value="id1">Word 1</button>
<button value="id2">Word 2</button>
<button value="id3">Word 3</button>

However, inside your click handler var value = $('.entry').val(); is matching all .entry elements, and val() is returning the value of the first of those matched elements (per the docs).

Instead, use $(this) to target the element clicked.

$('#pageSection').on('click', '.entry', function () {
   // Capture data from value property of each outputted PHP button
   var value = $(this).val();
   // Pass value to PHP through AJAX 
});

kaushik gandhi · Accepted Answer · 2013-08-30 21:55:46Z

1

try this code

while($row = mysqli_fetch_assoc($result)) {
   // Return output
   echo "<button class=\"entry\" value=\".$row["id"].\">" . $row["word"] . "</button>";
}

answered Aug 30, 2013 at 21:55

kaushik gandhi

7808 silver badges15 bronze badges

1 Comment

awejz Over a year ago

Thank you, Kaushik. Using the 'this' keyword in JQuery actually did the trick.

Collectives™ on Stack Overflow

How can you use PHP to fetch data from a database using data already returned from the database?

2 Answers 2

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Related