sara adly
sara adly

Reputation: 297

Make bootstrap timepicker popup on input click

I am tried to create a timepicker using this here

then I implemented its js and css in my project. but when I click it the popup didn't appear

I just have this code and can't add anew control to the glyphicons

TextBox control = new TextBox { ID = _TimeFieldID + item.BlueprintFieldId, CausesValidation = true, EnableViewState = true, CssClass = "form-control timepicker margin-top-none metadatacontrol", Width = new Unit(ctrWidth + "%") };

and fire it in javascript with

$(".timepicker").timepicker();

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?

EDIT: Here is my new javascript calling

  $(".timepicker").timepicker();    
    $('.timepicker').click(function () { 
        $('.bootstrap-timepicker-widget.dropdown-menu').show(); 
    });

Now I can show the timepicker popup , but it looks very wide I try this

  $('.bootstrap-timepicker-widget.dropdown-menu').css("display", "inline-block");

This code displays the popup. Now, the pop-up window width needs to be set the same as width of the input.

Upvotes: 0

Views: 3067

Answers (1)

Jatin Bhole
Jatin Bhole

Reputation: 186

use this javascript

$('.timepicker').focus(function (){
$('.timepicker').timepicker('showWidget');

});

or

$('.timepicker').click(function (){
$('.timepicker').timepicker('showWidget');

});

after your code

$(".timepicker").timepicker();

Upvotes: 3

Related Questions