CODEWITHSUNDEEP
phpjqueryhtmlpopulate
ComputerLocus
ComputerLocus

Reputation: 3618

Populating a Drop Down Menu (select)

I've been trying to solve my question based off of this answer: Populate select box from database using jQuery

I've attempted to implement what is said in the answers there but I am not having any luck here. As of now all that appears in the drop down menu is the default "Stone" item that starts in it.

Could anyone spare some time and give me a hand fixing my issue. My code should essentially read from a MySQL database which has over 150 ID's in order starting at 1 and use the corresponding name in the same ID's row to populate the drop down menu on load.

Example of what drop down menu would look like inside of it:

What corresponding DB would look like:

ID           item_name
1            Stone
2            Grass
3            Diamond

The code I'm using to try and do this is:

PHP (process_item_list.php):

$con = mysql_connect($DB_HOST,$DB_USER,$DB_PASSWORD);
$dbs = mysql_select_db($DB_NAME, $con);

$tableName = "itemlist";
$result = mysql_query("SELECT * FROM $tableName");

$data = array();
while ( $row = mysql_fetch_row($result) )
{
    $data[] = $row;
}
echo json_encode( $data );    
?>

jQuery/Javascript

<script type="text/javascript">
$(function(){
      var items="";
      $.getJSON("process_item_lists.php",function(data){
        $.each(data,function(index,item) 
        {
          items+="<option value='"+item.id+"'>"+item.name+"</option>";
        });
        $("#tradeItems").html(items); 
      });
    });
</script>

HTML

<select id="tradeItems"> 
<option value="">Stone</option>
</select>

I'm open to different ways to do this as well, as long as it still fills the drop down menu on load!

Edit: With the help of wirey the PHP issue is fixed. Here is what the results look like from running the PHP file: http://fogest.net16.net/mctrade/php/process_item_list.php When I run the actual page using the alert boxes which should give me the ID and the item name they both return undefined rather then the correct values.

Upvotes: 0

Views: 579

Answers (1)

Christoffer
Christoffer

Reputation: 2125

The results at http://fogest.net16.net/mctrade/php/process_item_list.php doesn't look like what you're expecting, it looks like this:

[ ["1","Stone","images\/stone.png"],
  ["2","Grass Block","images\/grass_block.png"],
  /* snip a lot of rows */
]

But what you are expecting is something like this: 

[ { "id":"1", "name":"Stone", "image?":"images\/stone.png"},
  { "id":"2", "name":"Grass Block","image?":"images\/grass_block.png"},
  /* and so on */
]

I think that you'll want to use mysql_fetch_assoc() instead of mysql_fetch_row(), that might give you proper output.

Bonus: you can give the response a proper content-type by adding a row before the echo:

header("Content-type: application/json");
echo json_encode($data);

Remark: when I inspected the source of http://fogest.net16.net/mctrade/php/process_item_list.php I found this at the end:

<!-- Hosting24 Analytics Code -->
<script type="text/javascript" src="http://stats.hosting24.com/count.php"></script>
<!-- End Of Analytics Code -->

This should not be part of the response, it will probably make the JSON parser crash.

Upvotes: 1

Related Questions