title: Dynamically change selectbox options based on previous option selection
body: <p>What I am trying to accomplish is the following... 
  HTML</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;head&gt;
      &lt;meta http-equiv="Content-type" content="text/html; charset=utf-8" /&gt;
      &lt;link href="css/jquery.selectbox.css" type="text/css" rel="stylesheet" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  
  
      &lt;select name="dateselector_parent" id="dateselector_parent" tabindex="1"&gt;
          &lt;option value=""&gt;--Select Date--&lt;/option&gt;
          &lt;option value="1"&gt;2012&lt;/option&gt;
          &lt;option value="1"&gt;2011&lt;/option&gt;
          &lt;option value="1"&gt;2010&lt;/option&gt;
          &lt;option value="2"&gt;Predefined Dates&lt;/option&gt;
      &lt;/select&gt;
  
      &lt;select name="dateselector_child" id="dateselector_child" tabindex="2"&gt;
          &lt;option value=""&gt;--Select Date--&lt;/option&gt;
          &lt;option value="1"&gt;January&lt;/option&gt;
          &lt;option value="1"&gt;February&lt;/option&gt;
          &lt;option value="1"&gt;March&lt;/option&gt;
          &lt;option value="1"&gt;April&lt;/option&gt;
          &lt;option value="1"&gt;May&lt;/option&gt;
          &lt;option value="1"&gt;June&lt;/option&gt;
          &lt;option value="1"&gt;July&lt;/option&gt;
          &lt;option value="1"&gt;August&lt;/option&gt;
          &lt;option value="1"&gt;September&lt;/option&gt;
          &lt;option value="1"&gt;October&lt;/option&gt;
          &lt;option value="1"&gt;November&lt;/option&gt;
          &lt;option value="1"&gt;December&lt;/option&gt;
          &lt;option value="2"&gt;Current Month&lt;/option&gt;
          &lt;option value="2"&gt;Month to Date&lt;/option&gt;
          &lt;option value="2"&gt;Last 7 Days&lt;/option&gt;
      &lt;/select&gt;
  
  
      &lt;script type="text/javascript" src="js/jquery-1.7.2.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/jquery.selectbox-0.2.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/datejs.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
      $(function () {
          $("#dateselector_parent").selectbox();
          $("#dateselector_child").selectbox();
      });
  
  
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>This creates two select boxes, I want one box to display content according to what the user chooses on the other one. For example, if the user chooses, 2010 or 2011 or 2012, I want to display Jan-Dec as options on the second one.  If the user chooses, Predefined Dates, I want to display Current Month, Month to Date, and Last 7 Days.  The javascript plugin I'm using allows the user to define the onChange, onOpen, and onClose methods.  I have been doing some research and it appears that AJAX is involved in trying to accomplish this, but since I don't know one bit of PHP I would like to know if it's possible to accomplish this with jQuery. (I have attempted to solve this problem with no luck of course, I am not looking for someone to do it for me, I just want to be pointed in the right direction, whether I can accomplish this with jQuery or if it's necessary to use AJAX since I haven't seen an example online with only jQuery).  </p>
  
  <p>Any help will be appreciated</p>