title: Open Bootstrap dropdown when ENTER key is pressed in input
body: <p>I want to open a Bootstrap dropdown when the ENTER key is pressed inside an input.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="top dropdown" id="search-bar"&gt;
    &lt;span class="fa fa-search" id="search" data-toggle="dropdown"&gt;&lt;/span&gt;                 
  
    &lt;input type="text" id="search" class="form-control" placeholder="Search" data-toggle="dropdown"/&gt; 
  
    &lt;ul class="dropdown-menu"&gt; 
      &lt;li&gt; Something &lt;/li&gt;                   
    &lt;/ul&gt; 
  &lt;/div&gt; &lt;!--search bar --&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$('input#search').keypress(function(e) {
    if(e.keyCode == 13) {
      $('input#search').dropdown();
    }
  });
  </code></pre>
  
  <p>The problem is that <code>data-toggle="dropdown"</code> triggers the dropdown when I just click inside the input. I only want to trigger it on ENTER.</p>