从另一个<select> [duplicate]更改并加载<select> mySQL值

I have two <select>, Categories and Subcategories. I want when i click an option/value from Categories then load & update the second <select> from mySQL. Subcategories values are in mySQL.

(1) Category Select

<select class="form-control" onchange="check()"  id="category" name="category">
    <option  value="cafe">Café</option>
    <option  value="bars-clubs">Bars-Clubs</option>
    <option  value="restaurants">Restaurants</option>
    <option  value="shopping">Shopping</option>
    <option  value="services">Services</option>
    <option  value="sducation">Education</option>
</select>

(2) Subcategory Select

<select class="form-control " id="SubCategory" name="subCategory">
    <?php include "server.php";

        $qyerry = "select * from " + [[FROM CATEGORY VALUE]]
        $result = mysql_query($qyerry);
        while($row = mysql_fetch_array($result)){
            echo "<option value=''>" . $row{'name'} . "</option>";
        }
    ?>
</select>

Here is my Javascript Code to get the value of onchange value option

<script>
   function check(){
      var x = document.getElementById("category").value;
   }                                
</script>

</div>

To implement cascading comboboxes, you need to use one of the following methods:

• Submit your form when changing the parent combobox.

  this means that, on your first select, you'll need to have something like this :<select class="form-control" onchange="location.replace('current?action=CategorySelectionChanged')". And in your server side prepare a query and passe its results to client side.

• Use an XmlHttpRequest to get the child's content and parse it via Javascript.

  Again, you'll need to fire a change event, that will call the server.I assume that you are using jQuery, so the writing will be via Ajax call.

  Please take a look on this link.