title: jQuery prevent default functionality in dropdown menu
body: <p>I have created a smart search component inside a dropdown menu. User should be allowed to search within the dropdown depending upon the value entered in the input=text provided in menu.</p>
  
  <p>But when i am clicking on the input the menu gets closed. 
  I tried using preventDefault as well but still it is not working.</p>
  
  <p><strong>HTML:</strong>                                </p>
  
  <pre><code>&lt;input type="text" readonly="readonly" value=""&gt;
  &lt;button class="btn i dropdown-toggle" data-toggle="dropdown"&gt; &lt;i class="caret-down"&gt;&lt;/i&gt;
  &lt;/button&gt;
  &lt;div class="dropdown-menu smart"&gt;
      &lt;input type="text" placeholder="Search"&gt;
      &lt;ul class="search-options"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Something&lt;/span&gt;&lt;/a&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS:</strong></p>
  
  <pre><code>// jQuery to prevent default close 
  $('body').on('click', '.dropdown-menu.smart input', function (event) {
      event.preventDefault();
  });
  </code></pre>