title: bootstrap dropdown partially working in modal
body: <p>I have a table filled with server names.  When I click on the link it goes to a page with various information about said server.  I'm using SSO to determine is a user has the ability to change some of the fields via a dropbox box with selectable items.  This is all working great....as a page</p>
  
  <p>However, I want to convert that page into a modal.  I have the modal working, it pulls all the information...however, the dropdown box only works every other time.  No exaggeration, every other time.  I click a server, the modal comes up and no values in the dropdown.  I can inspect it with firebug and see it has values in the list for the dropdown but nothing happens.  I close the modal, click on a link (the same or different) and the dropdown works just fine</p>
  
  <p>This is my html</p>
  
  <pre><code>&lt;td&gt;&lt;a href="{{ url_for('vm', vm=vm.GuestName) }}" data-keyboard="false" data-target="#vmModal" data-toggle="modal"&gt; {{ vm.GuestName }}&lt;/a&gt;&lt;/td&gt;
  </code></pre>
  
  <p>Here is my modal</p>
  
  <pre><code>&lt;div class="modal hide fade in" id="vmModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
      &lt;div class="modal-header"&gt;
        &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;×&lt;/button&gt;
        &lt;h3 id="myModalLabel"&gt;Virtual Machine Info&lt;/h3&gt;
      &lt;/div&gt;
      &lt;div class="modal-body" style="height: 600px; right: 12px"&gt;
      &lt;/div&gt;
      &lt;div class="modal-footer"&gt;
        &lt;button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true"&gt;Close&lt;/button&gt;
      &lt;/div&gt;
  &lt;/div&gt;&lt;!-- /.modal --&gt;
  </code></pre>
  
  <p>Here is my dropdown</p>
  
  <pre><code>{% if access %}
          &lt;div class="dropdown"&gt;
              &lt;li&gt;
                  &lt;strong&gt;Service:&lt;/strong&gt;
                  &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt; {{ item.Service }} &lt;b
                          class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                  &lt;ul class="dropdown-menu" role="menu"&gt;
                      {% for service in service_data %}
                          &lt;li&gt;&lt;a tabindex="-1"
                                 href="/api?name={{ item.GuestName }}&amp;service={{ service.name }}"&gt; {{ service.name }}&lt;/a&gt;
                          &lt;/li&gt;
                      {% endfor %}
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/div&gt;
  </code></pre>