Why can not I get the current date in a "DateTimePicker"? eonasdan plugin

0

The link to datetimepicker that I use this here

My problem is this:

I want to obtain the date that I indicate, but when I click on an external button, it indicates the previous date, not the last date that I indicate.

Ex: if I indicate the date 25/07/2017 this indicates the date previously selected ( 06/02/2017 date today, of the publication) how could I get the last date that I indicate in that input .

    $('.datetimepicker').datetimepicker({
        daysOfWeekDisabled: [0, 6],
        icons: {
            time: "fa fa-clock-o",
            date: "fa fa-calendar",
            up: "fa fa-arrow-up",
            down: "fa fa-arrow-down"
        },
        //defaultDate: new Date(),
        minDate: new Date(),
        disabledHours: [0, 1, 2, 3, 4, 5, 6, 7, 17, 18, 19, 20, 21, 22, 23, 24],
        enabledHours: [8, 9, 10, 11, 12, 13, 14, 15, 16],
    });
	$('#crear_fecha').data("DateTimePicker").minDate(new Date());

$(document).on('click', '#Crear', function() {
			alert($('#crear_fecha').data('DateTimePicker').date()._i);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/locale/es-do.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.45/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.45/css/bootstrap-datetimepicker.min.css" />

<input type='text' class="form-control datetimepicker" name='crear_fecha' id='crear_fecha' />
                            <button type="button" id="Crear" class="btn btn-primary">
                                <span class="fa fa-plus"></span><span class="hidden-xs"> Agregar</span>
                            </button>

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>

NOTE: The calendar is not due to an error on the web, but if you scroll the browser scroll, it will be displayed low.

    
asked by Pablo Contreras 06.02.2017 в 07:50
source

1 answer

1

In principle, everything seems to point to what is the .date()._i problem that you are using in the object returned by $('#crear_fecha').data('DateTimePicker') .

I have corrected the javascript error caused by a bad design and I have directly used the value returned by the call .date() .

$('.datetimepicker').datetimepicker({
  daysOfWeekDisabled: [0, 6],
  icons: {
    time: "fa fa-clock-o",
    date: "fa fa-calendar",
    up: "fa fa-arrow-up",
    down: "fa fa-arrow-down"
  },
  minDate: new Date(),
  disabledHours:
    [0, 1, 2, 3, 4, 5, 6, 7, 17, 18, 19, 20, 21, 22, 23, 24],
  enabledHours:
    [8, 9, 10, 11, 12, 13, 14, 15, 16],
});
$('#crear_fecha').data("DateTimePicker").minDate(new Date());

$(document).on('click', '#Crear', function() {
  alert($('#crear_fecha').data('DateTimePicker').date());
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/locale/es-do.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.45/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.45/css/bootstrap-datetimepicker.min.css" />

<div class="container">
  <div class="row">
    <div class='col-sm-6'>
      <input type='text' class="datetimepicker" name='crear_fecha' id='crear_fecha' />
      <button type="button" id="Crear" class="btn btn-primary">
        <span class="fa fa-plus"></span>
        <span class="hidden-xs">Agregar</span>
      </button>
    </div>
  </div>
</div>

<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>

After that the control works as expected.

    
answered by 06.02.2017 / 08:35
source