Search code examples
twitter-bootstrapbootstrap-datetimepicker

Bootstrap 3 datetimepicker widget position


I am using bootstrap 3 diatomite picker widget, but I am unable to control its position. Right now the widget appears at the bottom of my page when I don't use horizontal and vertical options, but when I use horizontal and vertical options I get an error saying horizontal is not a valid option.

These options are not working for me:

horizontal: 'right',
vertical: 'top'

Here is my code:

enter code here
<input type="text" value="<fmt:formatDate value="${visitDetail.visitDate }" pattern="dd-MM-yyyy hh:mm aaa" />" name="patient.visitDetails[${status.index}].visitDate" class="form-control" id="visitDate${status.index}" placeholder="visitDate${status.index}"> 


<script type="text/javascript">
    $(function () {
        $("#visitDate${status.index}").datetimepicker({
            showTodayButton: true,
            inline: false,
            format: "DD-MM-YYYY hh:mm A",
            sideBySide: true,
            horizontal: 'right',
            vertical: 'top'
        });
    });
</script>

Solution

  • $('.date').datetimepicker({
        language: 'es',
        format: 'dd/mm/yyyy',
        autoclose: 1,
        weekStart: 1,
        startView: 2,
        todayBtn: 1,
        todayHighlight: 1,
        forceParse: 0,
        minView: 2,
        pickerPosition: "top-left"
    });