CODEWITHSUNDEEP
javascriptjquerytimepicker
msp
msp

Reputation: 127

How to set max time limit in jQuery timepicker plugin

I am using jQuery's timepicker plugin and I set the start time, and I need to set max time limit for timepicker. So I kept max time using endTime attribute, but this seems to be not working out for me.

Expected output:

1)Start time should be morning 7:00 AM and endtime 4:00 PM.

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">

<script src="https://code.jquery.com/jquery-3.4.1.js"></script>

<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<script>
$('.timepicker').timepicker({
    timeFormat: 'h:mm p',
    interval: 60,
    startTime: '7:00 am',
    dynamic: true,
    dropdown: true,
    scrollbar: true,
    endTime: '4:00 pm',

});
</script>

Upvotes: 1

Views: 1702

Answers (2)

Devsi Odedra
Devsi Odedra

Reputation: 5322

use minTime and maxTime

$('.timepicker').timepicker({
    timeFormat: 'h:mm p',
    interval: 60,
    dynamic: true,
    dropdown: true,
    scrollbar: true,
    minTime: '7:00am',
    maxTime: '4:00pm',
});
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">

<input type="text" class="timepicker">
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>

<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>

Upvotes: 0

Pushprajsinh Chudasama
Pushprajsinh Chudasama

Reputation: 7979

Use min and max instead of startTime and endTime.

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">

<script src="https://code.jquery.com/jquery-3.4.1.js"></script>

<script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
<script>
$('.timepicker').timepicker({
    timeFormat: 'h:mm p',
    interval: 60,
    dynamic: true,
    dropdown: true,
    scrollbar: true,
    min: '7:00 am',
    max: '4:00 pm'
});
</script>

Upvotes: 1

Related Questions