Currently, I am utilizing the Bootstrap DateTimePicker plugin to enable users to select a specific date and time. The plugin functions well with one minor issue - whenever the user clicks outside or loses focus on the calendar box, both the box itself and the input element vanish!
I have thoroughly examined the css and js files in search of any clues that might guide me towards a solution (e.g., focus, blur, etc), but unfortunately, my efforts have been fruitless.
If someone could kindly direct me towards the right path, I would greatly appreciate it. Thank you!
Here is the HTML code generating the element:
<div id="eventstartdate" class="input-append date"><input type="text" data-format="dd/MM/yyyy hh:mm:ss" /><span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i></span></div>
<script>
$(document).ready(function () {
$('#eventstartdate').datetimepicker({
language: 'en',
pick12HourFormat: true,
format: 'dd/MM/yyyy hh:mm:ss',
maskInput: true
});
});
</script>