title: Creating two dependent Dropdown List
body: <p>I want to make the third drop down populated based on selection on second drop down refer value from first and second drop down.</p>
  
  <p>jQuery</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function() {
  
  $("#parent_cat").change(function() {
      $.get('loadsubcat.php?parent_cat=' + $(this).val(), function(data) {
          $("#sub_cat").html(data);
      }); 
  });
  
  $("#sub_cat").change(function() {
      $.get('loadsubelement.php?sub_cat=' + $(this).val() + $('#parent_cat').val(), function(data) {
          $("#select_subelement").html(data);
      }); 
  });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>loadsubelement.php</p>
  
  <pre><code>&lt;?php 
  include('config.php');
  $parent_cat = $_GET['parent_cat'];
  $sub_cat = $_GET['sub_cat'];
  $query = mysqli_query($connection, "SELECT * FROM maincategories WHERE categoryID = {$parent_cat}");
  $query = mysqli_query($connection, "SELECT * FROM maincategories WHERE subcategoryID = {$sub_cat}");
  echo '&lt;option value=""&gt;Please select&lt;/option&gt;';
  while($row = mysqli_fetch_array($query)) {
  echo '&lt;option value="'.$row['subcategoryID'].'"&gt;' . $row['maincategory_name'] . "&lt;/option&gt;";
  }
  ?&gt;
  </code></pre>