populate one dropdown base on another dropdown using PHP and MySQL

Question

I have a dropdown which gets the information from a query using mysqli_query() now, once selecting a choice from the first dropdown I want the second dropdown to be filled with data from a difference query.

This is my code

HTML:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
    $('.country').on('change', function() {
    // Code to add country information in url
    location.href = location.href.split('?')[0]
        + ['?country', $(this).val()].join('=');
    });
});
</script>

PHP First dropdown:

<?php
    $countries = mysqli_query($mysqli,"select source from nhws.masterkey group by source;");
    echo "<select name='country' style=width:200px>"; 
    echo "<option size =30 ></option>";
    while($row = mysqli_fetch_array($countries)){        
        echo "<option value='".$row['source']."'>".$row['source']."</option>"; 
    }
    echo "</select>";
?>

PHP Second dropdown:

<?php
if (isset($_GET['country'])) {
   $country = $_GET['country'];
   echo $country;
   $variables = mysqli_query($mysqli,"select variable from nhws.num_all_{$country} group by variable;");
   echo "<select name='variable' style=width:200px>"; 
   echo "<option size =30 ></option>";
   while($row = mysqli_fetch_array($variables)) {        
     echo "<option value='".$row['variable']."'>".$row['variable']."</option>"; 
   }
   echo "</select>";
}
?>

Now, once a selection was choosen from the first dropdown nothing happens in the second dropdown.

Thanks!

if the information is on the server and not immediately transfered client side then ajax is the way to get at it on demand. If you can bring "optional" data with the initial page load then you can store it in hidden div's. Personally i would go with the former and use ajax if there is a lot of data to be pulled for the full form, just bringing it in on demand will speed up the page load initially. — CodingInTheUK
– CodingInTheUK, Commented Feb 4, 2016 at 22:14
I open to suggestions using any methods. forget about no ajax. — user3882752
– user3882752, Commented Feb 4, 2016 at 22:19

Minhaz · Accepted Answer · 2016-02-04 22:19:09Z

1

I assume you can use jQuery. So add a jQuery listener like this:

<script>
$(document).ready(function() {
    $('.country').on('change', function() {
        // Code to add country information in url
        location.href = location.href.split('?')[0]
            + ['?country', $(this).val()].join('=');
    });
});
</script>

Now on php code at the top add something like this after the code you mentioned

if (isset($_GET['country']) {
    $country = $_GET['country'];
    // code to prevent SQL injection
    // ... code to get data from DB using country name
    // ... code to print a new select box based on data from DB
}

answered Feb 4, 2016 at 22:19

Minhaz

9771 gold badge11 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user3882752 Over a year ago

Added the script section on top as is. and add this after my first dropdown. And add your other PHP code with this query select variable from nhws.num_all_{$country} group by variable; and nothing shows after choosing from the first dropdown

Minhaz Over a year ago

@user3882752 Add the php code I mentioned just after your php code. then in the HTML content add this script, also you would have to include jquery library before that

user3882752 Over a year ago

I edited my question and include your code in it. it still does not work for me. Take a look at the question to see the full code. Thanks!

Minhaz Over a year ago

@user3882752 in the PHP First dropdown: change <select name='country' style=width:200px> to <select class='country' name='country' style='width:200px'>

Collectives™ on Stack Overflow

populate one dropdown base on another dropdown using PHP and MySQL

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related