asked on

Populate Select Menu from JQuery with PHP MySQL query result

Let's say I have a jQuery element (menu select) set up as below:

<div data-role="fieldcontain">
            <select name="selectmenu1" id="selectmenu1">
                <option value="Where MySQL Index Goes">
                    Where MySQL RESULTS GO
                </option>
            </select>
        </div>

Open in new window

And I have some PHP which runs a query to return a list of values like this (this query dumps the results into a table, just to have some place to put it):

<?php
$con = mysql_connect("localhost","root","");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("Mydatabase", $con);

$result = mysql_query("SELECT * FROM wtbl_stuff ORDER BY stuff_id");

echo "<table border='1'>
<tr>
<th>stuff_id</th>
<th>stuff_number</th>
</tr>";

while($row = mysql_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['stuff_id'] . "</td>";
  echo "<td>" . $row['stuff_number'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysql_close($con);
?>

Open in new window

How can I use the PHP MySQL to populate the above Select box in JQuery? I'm sure it's easy, but I've been going around with it for hours with no success. Thanks.

ASKER CERTIFIED SOLUTION

gr8gonzo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

JP_TechGroup

ASKER

That's actually what I had, but the menu box does not populate, I know the connection and query works, what am I missing?

gr8gonzo

What is the resulting HTML source?

Mark Brady

I would try it like this.

<?php
$con = mysql_connect("localhost","root","");
if (!$con) {
    die('Could not connect: ' . mysql_error());
}

mysql_select_db("Mydatabase", $con);

// create the select element
$select = '<select name="selectmenu1" id="selectmenu1">';

// run the query
$result = mysql_query("SELECT * FROM wtbl_stuff ORDER BY stuff_id");

// loop the result set for items to populate select element
while($row = mysql_fetch_array($result)) {
    $select .= "<option value='".$row['stuff_id']."'>";
    $select .= $row['stuff_number'];
    $select .= "</option>";
  }

// close out the select
$select .= "</select>";
?>

<div data-role="fieldcontain"><?php echo $select; ?></div>

Open in new window

If it doesn't work, check there is not another variable $result anywhere after your mysql call that would modify the values inside $result. Also, you could var_dump($select); if you use my suggestion above then see if everything looks correct.

Your div has no id or name. Are you positive there is nothing wrong with it and it displays properly if you put a simple sample select element inside it instead of the database results?

Check those things and let me know what you find.

JP_TechGroup

ASKER

Found it. Quite silly really. Had the page saved as HTML not PHP.
Half a day of my life wasted!