Jquery pickatime Drop down window not closing after on change event

Question

I am using JQuery Time picker. On selection of time, the dop-down window which displays the time has to close, but it doesnot.

<h:inputText id="selectTime" value="00:00" />

$('#selectTime').pickatime({
    format: 'HH:i',
    disable: [
        [0, 0]
    ]
})
$('#selectTime').on('change', function() {
    $(this).hide();
})

For the above on change event, the input text gets hide but not the Time Picker Drop down. I understad, as I am using this, it will hide the text box. But what is the correct way to clode the Time Picker after time is being selected.

Answer 1

Maybe your input element falls within label element. You must use a container to separate events of picker root element into label events.

Create a blank div with sample id "root-picker-outlet":

<div id="root-picker-outlet"></div>

Initialize picker:

$('.timepicker').pickatime({
  container: '#root-picker-outlet'
})