jquery timepicker set time to 00:00:00

I am using the jquery.timepicker by Jon Thornton.

I have an aspnet core MVC application utilizing the timepicker library.

I have a model with the following properties...

 [DisplayName("Start Time")]
 public TimeSpan? StartTime { get; set; }

 [DisplayName("End Time")]
 public TimeSpan? EndTime { get; set; }

I have a razor view with the following elements..

<div class="form-group row">
        <div class="col-2">
            <label asp-for="StartTime" class="col-form-label"></label>
        </div>
        <div class="col-5">
            <input asp-for="StartTime" type="text" class="form-control timepicker"  />
        </div>
        <span asp-validation-for="StartTime" class="text-danger"></span>
    </div>
    <div class="form-group row">
        <div class="col-2">
            <label asp-for="EndTime" class="col-form-label"></label>
        </div>
        <div class="col-5">
            <input asp-for="EndTime" type="text" class="form-control timepicker" autocomplete="off" />
        </div>
        <span asp-validation-for="EndTime" class="text-danger"></span>
    </div>

I have setup the timepicker to use the properties below..

$(document).ready(function () {
$('input.timepicker').timepicker({
    timeFormat: 'H:i:s',
    step: 15,
    show2400: true
});

});

Each and every time I select "00:00:00" from the timepicker, the value 0 is set in the input box. Any ideas why it wont set to "00:00:00"?

Solution

You may not reference the correct package. When I reference the cdn package, the situation is the same as you showed, but after I download and add the official package, it can display 00:00:00 correctly.

Two package:

Download it and reference it in the view.