Question

I was trying out this code for getting a dropdown list populated by a MySQL database and if a certain category is selected another dropdown pops up.I thought this code was correct and I guess not. The first dropdown doesn’t even populate from the database it just ends up being blank,=. I’ve been tinkering with it for quite awhile with no success.

Here is what I’m trying to replicate … http://www.blueicestudios.com/chained-select-boxes-using-php-mysql-ajax/

Here is what there is so far.

The Main Form :

<?php include ('connect.php'); ?>
<?php include('func.php'); ?>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"><!--mce:0--></script>

<script type="text/javascript">
$(document).ready(function() {
    $('#wait_1').hide();
    $('#drop_1').change(function(){
      $('#wait_1').show();
      $('#result_1').hide();
      $.get("func.php", {
        func: "drop_1",
        drop_var: $('#drop_1').val()
      }, function(response){
        $('#result_1').fadeOut();
        setTimeout("finishAjax('result_1', '"+escape(response)+"')", 400);
      });
        return false;
    });
});

function finishAjax(id, response) {
  $('#wait_1').hide();
  $('#'+id).html(unescape(response));
  $('#'+id).fadeIn();
}
</script>

<form action="" method="post">

<select id="drop_1" name="drop_1">
<option disabled="disabled" selected="selected"> Select Main Category</option>
</select>
<span id="wait_1" style="display: none;">
<img src="ajax-loader.gif" alt="Please Wait">
</span>
<span id="result_1" style="display: none;"></span>
</form>

Here is the func.php file:

<?php 

function getTierOne()
{
    require_once('connect.php');
    $result = mysql_query("SELECT category FROM subcats")
    or die(mysql_error());
    while($tier = mysql_fetch_array( $result ))
    {
        $catitle = $tier['category'];
    echo "<option> $catitle </option>" ;
    }   
    mysql_close();
    }   

    if(isset($_GET['func'])&& $_GET['func'] == 'drop_1') {  
        drop_1($_GET['drop_var']);
        }
        function drop_1($drop_var)
        {
        require_once('connect.php');
        $result = mysql_query("SELECT * FROM subcats WHERE category='$drop_var'")
        or die(mysql_error());

        echo '
        <select id="subcat" name="subcat">
        <option disabled="disabled" selected="selected" value=" ">Choose one</option>
        <option value="'.$drop_2['subcat'].'">'.$drop_2['subcat'].'</option>
        </select>
        ';
        mysql_close();

        echo '
        <input name="submit" type="submit" value="Submit">';
        }
?>

Answer 1

If anyone wants to know the answer I figured it out.

Change This.

{
        $catitle = $tier['category'];
    echo "<option> $catitle </option>" ;
    } 

To this

 while($tier = mysql_fetch_array( $catresult )) 

        {
           echo '<option value="'.$tier['category'].'">'.$tier['category'].'</option>';
        }