[FIXED] jQuery UI Datepicker not showing previously chosen date/time

Issue

I am using jQuery UI Datepicker (http://trentrichardson.com/examples/timepicker/). Everything is working correctly except for one thing. I can choose the date/time I want and save. Everything is stored in the database correctly and when I come back to the editor, I see the date/time that I had previously saved. Everything good so far. The problem is when I try to edit the date/time. See what happens:

Notice how even though the input field textbox has the date/time "2017-11-01 08:23:00", the calendar is by default showing the current day of my computer, September 20th, and for time it is showing the default value of 12:00 am. Why isn't the calendar respecting the values that appear in the input field textbox?

EDIT: This is what I am using in my JavaScript file:

// jQuery UI Datepicker (http://trentrichardson.com/examples/timepicker/)
$('#start_date').datetimepicker({
    timeInput: true,
    timeFormat: "hh:mm tt"
});

This is what I have in my PHP/.ctp file (I am using CakePHP 1.2):

<div>
    <?php echo $form->input('start_date', array('id' => 'start_date', 'label' => __l('Start Date'), 'type' => 'text'));?>
</div>  

Solution

The accepted answer at Is it possible to change date format in date time picker? gave me the hint to find the solution for what I needed. This was the solution for me:

$('#start_date').datetimepicker({
    timeInput: true,
    dateFormat: 'yy-mm-dd', 
    timeFormat: 'HH:mm:ss'
}); 

I simply had to follow the same format of how the database stores the date and time, since that is how CakePHP retrieves the data. Now everything works correctly for me.

Answered By - Jaime Montoya