Set datetimepicker default value using PHP datetime value-CodePudding

I have tried to set datetime value from database to bootstrap datetimepicker input field, but I am not getting the exact date value while editing a record. Also I have tried to convert datetimepicker to insert in database using php. For example, I have tried the following:

input: 30/12/2021 11:06 PM
output: 1970-01-01 00:00:00

Code tried:

echo date('Y-m-d H:i:s',strtotime($_POST['lot_datetime'])); 

$(function () {
  $('#datetimepickerDemo').datetimepicker({
    date: '<?php date('d/m/Y h:i:s a', strtotime($lottery['lotdatetime'])); ?>'
  });
});

CodePudding user response：

Set the datetime using this code:

$('#datetimepickerDemo').datetimepicker({
    format:"d-M-yy h:mm tt")
});
$('#datetimepickerDemo').val('<?php date('d/m/Y h:i:s a', strtotime($lottery['lotdatetime'])); ?>');

Set the datetimepicker date format and set the date value directly to the text field.

CodePudding user response：

Assigning the date property with a Y-m-d H:i:s formatted string from php definitely will work. You should check that you have successfully loaded all required libraries and also check for client-side errors. There could be any number of things holding you back. Are you using JQuery3 which no longer uses size? Is the datetimepicker not instantiated and are you happy to add the moment library?

Most importantly, while testing, make sure that some kind of datetime expression is actually being printed client-side (from the server-side code). In your second attempt, you are missing echo.

Printing your php data into the javascript block should look like this:

$(function() {
  $('#datetimepicker1').datetimepicker({
    date: '<?php echo date('Y-m-d H:i:s', strtotime($lottery['lotdatetime'])); ?>'
  });
});

$(function() {
  $('#datetimepicker1').datetimepicker({
    date: '2021-12-30 23:06:00'
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css">

<div class="container">
  <div class="row">
    <div class='col-sm-6'>
      <div class="form-group">
        <div class='input-group date' id='datetimepicker1'>
          <input type='text' class="form-control" />
          <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
          </span>
        </div>
      </div>
    </div>
  </div>
</div>