@randika-srimal/time-slot-picker NPM

Time Slot Picker - jQuery Plugin

This will add a beautiful embedded time picker to your website.

Installation

Install time-slot-picker with npm

  npm i @randika-srimal/time-slot-picker

Usage/Examples

<div id="time-slot-picker"></div>

$('#time-slot-picker').timeSlotPicker(
    {
        startTime:'00:00',
        endTime:'24:00',
        timeStep:'15',
        defaultDate:'2021-05-31',
        maxDateTime:'2021-06-01 13:15',
        minDateTime:'2021-05-28 10:15',
        minDayTime:'09:00',
        maxDayTime:'18:00',
        inputElementSelector:'#time-slot-input',
        headerColor:'#205C40',
        headerTextColor:'#ffffff',
        activeSlotColor:'#74956C',
    }
);

These passing options are all optional.

When a time slot selected it will trigger a timeSlotSelected event and when discarded it will trigger timeSlotDiscarded events. You can catch these to run your methods.

$('#time-slot-input').on('timeSlotSelected',function(){
  // Your functions
});

$('#time-slot-input').on('timeSlotDiscarded',function(){
    // Your functions
});