dynamic drop down box?

Question

I got a database table called category as shown:

I am trying to do a d

Answer 1

Here is an example that will do what you want. Essentially, you can use jQuery / AJAX to accomplish this.

I updated my example code to match your server login / table / field names, so if you copy/paste these two examples into files (call them tester.php and another_php_file.php) then you should have a fully working example to play with.

I modified my example below to create a second drop-down box, populated with the values found. If you follow the logic line by line, you will see it is actually quite simple. I left in several commented lines that, if uncommented (one at a time) will show you what the script is doing at each stage.

FILE 1 -- TESTER.PHP

    
        
        
    


    
        Please Select
        John Doe
        Mike Williams
        Chris Edwards
    
    

FILE 2 - another_php_file.php

Found in Database:
            
    ';

//Parse mysql results and create response string. Response can be an html table, a full page, or just a few characters
    if ($num_rows_returned > 0) {
        while ($row = mysql_fetch_assoc($result)) {
            $r = $r . '' . $row['name'] . '';
        }
    } else {
        $r = '
No student by that name on staff
';
    }

//Add this extra button for fun
    $r = $r . 'Click Me';

//The response echoed below will be inserted into the 
    echo $r;

---

To answer your question in the comment: "How do you make the 2nd drop down box populate fields that are only relevant to a selected option from the 1st drop down box?"

A. Inside the .change event for the first dropdown, you read the value of the first dropdown box:

$('#dropdown_id').change(function() {
var dd1 = $('#dropdown_id').val();
}

B. In your AJAX code for the above .change() event, you include that variable in the data you are sending to the 2nd .PHP file (in our case, "another_php_file.php")

C. You use that passed-in variable in your mysql query, thereby limiting your results. These results are then passed back to the AJAX function and you can access them in the success: portion of the AJAX function

D. In that success function, you inject code into the DOM with the revised SELECT values.

That is what I am doing in the example posted above:

1. The user chooses a student name, which fires the jQuery .change() selector

2. Here is the line where it grabs the option selected by the user:

   var sel_stud = $(this).val();

3. This value is sent to another_php_file.php, via this line of the AJAX code:

   data: 'theOption=' + sel_stud,

4. The receiving file another_php_file.php receives the user's selection here:

   $selStudent = $_POST['theOption'];

5. Var $selStudent (the user's selection posted in via AJAX) is used in the mysql search:

   $query = " SELECT * FROM `category` WHERE `master` = 0 AND `name` = '$selStudent' ";

   (When changing the example to suit your database, the reference to $selStudent was removed. But this (here, above) is how you would use it).

6. We now build a new code block, storing the HTML in a variable called $r. When the HTML is fully built, I return the customized code back to the AJAX routine simply by echoing it back:

   echo $r;

   The received data (the customized

   code block) is available to us inside the AJAX success: function() {//code block}, and I can inject it into the DOM here:

   $('#LaDIV').html(whatigot);

And voila, you now see a second dropdown control customized with values specific to the choice from the first dropdown control.

Works like a non-Microsoft browser.