Window datetimepicker out of place

Asked

Viewed 49 times

1

I have a problem with the position in which the datetimepicker window appears, as in the image below it appears directly and a little distant from the source field, I would like it to be centered and below the field and next as well. I appreciate anyone who can help me. Follow the image and the code I’m using.

janela deslocada

$('.data_formato').datetimepicker({
weekStart: 1,
todayBtn: 1,
autoclose: 1,
todayHighlight: 1,
startView: 2,
forceParse: 0,
showMeridian: 1,
language: "pt-BR",
//startDate: '+0d'
});
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

<!--Campo Previsão-->
<div class="col-md-9 col-xs-4">
<label for="previsao" class="col-sm-2 control-label" >
<br>Previsão:</label>
<div class="col-sm-11">
<div class='input-group col-lg-5 date data_formato' data-date-format="dd/mm/yyyy HH:ii:ss">
<input type='text' class="form-control" placeholder="00/00/0000 00:00:00"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
<!--Fim Campo Previsão-->

javascript jquery html5 bootstrap-3 datepicker

1 answer

0

Try this:

$(Function () { $('#datetimepicker1'). datetimepicker({ widgetPositioning: { horizontal: 'left', vertical: 'top' } }); });

Browser other questions tagged javascript jquery html5 bootstrap-3 datepicker

You are not signed in. Login or sign up in order to post.