title: Load a second combobox inside fancybox
body: <p>I have a combobox with 2 fancybox modal, state and city. I need to load a combo city after selecting the state. My Code:</p>
  
  <pre><code>&lt;div id="city" class="hide"&gt;
  
      &lt;asp:Literal ID="litCity" runat="server"&gt;&lt;/asp:Literal&gt;
      &lt;a href="#data"&gt;Trocar de Cidade&lt;/a&gt;
  
  &lt;/div&gt;
  
  &lt;asp:UpdatePanel ID="updCity" runat="server" UpdateMode="Conditional"&gt;
  &lt;ContentTemplate&gt;
  
      &lt;div id="data" class="hide"&gt;
  
      &lt;asp:HiddenField ID="hdnNovaCidade" runat="server" Value="" /&gt;
      &lt;div class="row"&gt;
  
      &lt;label for="drpState"&gt;Estado *&lt;/label&gt;
      &lt;asp:DropDownList ID="drpState" runat="server" AutoPostBack="True" &gt; &lt;/asp:DropDownList&gt;
  
      &lt;/div&gt;
  
  &lt;div class="row"&gt;
  
      &lt;label for="drpCity"&gt;Cidade *&lt;/label&gt;
      &lt;asp:DropDownList ID="drpCity" runat="server"&gt;&lt;/asp:DropDownList&gt;
  
  
  &lt;/div&gt;
  
      &lt;input id="btCidade" type="submit" value="Escolher Cidade" /&gt;
  
  &lt;/div&gt;
  &lt;/ContentTemplate&gt;
  &lt;Triggers&gt;
  
      &lt;asp:AsyncPostBackTrigger ControlID="btCarregaCidade" EventName="Click" /&gt;
  
  &lt;/Triggers&gt;
  &lt;/asp:UpdatePanel&gt;
  </code></pre>
  
  <p>JQUERY</p>
  
  <pre><code>$('[id$="drpState"]').change(function () {
  
      $('[id$="hdnState"]')[0].value = $(this).val();
      $('[id$="btCarregaCidade"]')[0].click();
  
  });
  </code></pre>
  
  <p>What happens is that the page reloads after the event button and closes the fancybox.
  How do I load the combobox cities without closing the modal?</p>
  
  <p>Thanks for help</p>