How to use Javascript or Jquery to switch the select elements?
<p>I don't know much about Javascript and Jquery, but I do have to use it on a HTML select tags. I have two database tables, grouptypes and groups. A grouptype can have multiple groups, but a group only belongs to one grouptype. I have two select tags, one is grouptypes and another one is groups. What I want to do is that whenever a user select a grouptype in the grouptypes dropdown menu, it triggers a handler to retrieve the corresponding groups that belong to that grouptype. I need javascript or Jquery to get it done, but I am not able to write it myself. So anyone can help me? I would so appreciate it.</p>

<pre><code> GroupType: &lt;select name="groupType"&gt;

    &lt;?php foreach($grouptypes as $type) : ?&gt;

    &lt;?php echo "&lt;option value='" . $type['name'] . "'&gt;" .$type['name']. "&lt;/option&gt;"; ?&gt;

    &lt;?php endforeach ?&gt;

  &lt;/select&gt;&lt;br /&gt;


  Group: &lt;select name="groups"&gt;

    &lt;?php foreach($groups as $group) : ?&gt;

    &lt;?php echo "&lt;option value='" . $group['name'] . "'&gt;" .$group['name']. "&lt;/option&gt;"; ?&gt;

    &lt;?php endforeach ?&gt;

  &lt;/select&gt;&lt;br /&gt;


  &lt;?php 
    $query = "SELECT id, name FROM group_type";

    $grouptypes = $_db-&gt;getResultsForquery($query);


    $query = "SELECT id, name FROM groups";

    $groups = $_db-&gt;getResultsForquery($query);


  ?&gt;
</code></pre>
