wickedpicker is not showing selected time values

Question

I am using jquery wicked picker plugin. Following is my HTML.

<input type="text" id="timepickerOne" name="timepickerone" class="_timePicker" style="width:80px" placeholder="From" />
<input type="text" id="timepickerTwo" name="timepickertwo" class="_timePicker" style="width:80px" placeholder="To" />

And this is the jquery.

    startTime = $('#timepickerOne').wickedpicker('time');
    endTime = $('#timepickerTwo').wickedpicker('time');

And in following way I've given options for wickedpicker.

    <script src="~/Scripts/wickedpicker.js"></script>
    <link href="~/Css/wickedpicker.css" rel="stylesheet" />
    <script type="text/javascript">
    var options = {
        twentyFour: true,
        upArrow: 'wickedpicker__controls__control-up',
        downArrow: 'wickedpicker__controls__control-down',
        close: 'wickedpicker__close',
        hoverState: 'hover-state',
        showSeconds: true,
      
    };
    $('._timePicker').wickedpicker(options);
</script>

It's displaying fine same as wickedpicker.But the problem is it's not taking selected values. It's taking current values which are set by default.It should have values, which I selected using picker. Can anyone help me

Answer 1

Have you tried adding:

 now: "17:00", //hh:mm 24 hour format only, defaults to current time 

so your code would be:

var options = {
now: "17:00", //hh:mm 24 hour format only, defaults to current time 
    twentyFour: true,
    upArrow: 'wickedpicker__controls__control-up',
    downArrow: 'wickedpicker__controls__control-down',
    close: 'wickedpicker__close',
    hoverState: 'hover-state',
    showSeconds: true,
};
$('._timePicker').wickedpicker(options);