title: Make bootstrap timepicker popup on input click
body: <p>I am tried to create a timepicker 
  using this <a href="http://jdewit.github.io/bootstrap-timepicker/" rel="nofollow">here</a></p>
  
  <p>then I implemented  its js and css in my project.
  but when I click it the popup didn't appear </p>
  
  <p>I just have this code and can't add anew control to the glyphicons </p>
  
  <pre><code>TextBox control = new TextBox { ID = _TimeFieldID + item.BlueprintFieldId, CausesValidation = true, EnableViewState = true, CssClass = "form-control timepicker margin-top-none metadatacontrol", Width = new Unit(ctrWidth + "%") };
  </code></pre>
  
  <p>and fire it in javascript with </p>
  
  <pre><code>$(".timepicker").timepicker();
  </code></pre>
  
  <p>how can I make it appears popup in textbox click?
  How can ovride the js to get timepicker fire on a click in the input field?
  any help?</p>
  
  <p><strong>EDIT:</strong>
  Here is my new javascript calling </p>
  
  <pre><code>  $(".timepicker").timepicker();    
      $('.timepicker').click(function () { 
          $('.bootstrap-timepicker-widget.dropdown-menu').show(); 
      });
  </code></pre>
  
  <p>Now I can show the timepicker popup , but it looks very wide 
  I try this </p>
  
  <pre><code>  $('.bootstrap-timepicker-widget.dropdown-menu').css("display", "inline-block");
  </code></pre>
  
  <p>This code displays the popup. Now, the pop-up window width needs to be set the same as width of the input.</p>