title: PHP populated dropdown, onchange populate different dropdown based on value
body: <p>Hi so the here is my question,</p>
  
  <p>I have a Database containing Categories and Subcategories.
  I have two dropdown boxes (select). I want them both to be populated by using PHP/MYSQL.</p>
  
  <p>My Categories have been generated:</p>
  
  <pre><code>&lt;select name="prod_cat"&gt;
      &lt;?php
          include("php/dbconnect.php");
  
          $sql = "SELECT * FROM categories";
          $result = mysqli_query($conn, $sql);
  
          if (mysqli_num_rows($result) &gt; 0){
              while ($row = mysqli_fetch_array($result))
              {
              echo '&lt;option value="'. $row["cat_name"] .'"&gt;'. $row["cat_name"] .'&lt;/option&gt;';
              }
          }
          else{echo "No categories were found!";}
          mysqli_close($conn);
      ?&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/ecTTx.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ecTTx.png" alt="browser preview of dropdown boxes"></a></p>
  
  <p>I want the subcategories to load when the category has changed.
  My SQL will look something like this:</p>
  
  <pre><code>SELECT subcat_name FROM subcategories WHERE cat_name = '$prod_cat'
  </code></pre>
  
  <p>I need to get the value from the categories dropdown and store it as a variable.
  In the past I have done something similar in javascript:</p>
  
  <pre><code>var subcat=document.forms["form"]['subcat'].value;
  </code></pre>
  
  <p>and then changed the value of another dropdown by calling an onChange(); function like:</p>
  
  <pre><code>document.getElementById('subcat').innerHTML='&lt;option value=""&gt;&lt;/option&gt;';
  </code></pre>
  
  <p>I hope someone can point me in the right direction! Should I be looking into AJAX, JavaScript or can it all be done with PHP?</p>
  
  <p>Thank you.</p>