I need a jQuery timepicker plugin

[SurajkaliMotiar]

Hi
I am building a booking system for which i need to block out certain times on specific dates. For that I need a plugin that must disable specific times using an array. Any suggestions!!!

[Sodah73]

Hello, you can use: Flatpickr

Example:

<input id="datetime-picker" type="text">

<script>
  // Array with disabled times and days
  const disabledTimes = [
    { day: "2024-12-25", times: ["10:00", "14:00"] }, // Christmas: closed between 10:00 and 14:00
    { day: "2024-12-31", times: ["18:00", "22:00"] }  // New Year's Eve: closed between 6:00 p.m. and 10:00 p.m.
  ];


  function isTimeDisabled(date) {
    const formattedDate = date.toISOString().split("T")[0]; 
    const hours = date.getHours().toString().padStart(2, "0");
    const minutes = date.getMinutes().toString().padStart(2, "0");
    const time = `${hours}:${minutes}`;

    return disabledTimes.some(disabled =>
      disabled.day === formattedDate && disabled.times.includes(time)
    );
  }


  flatpickr("#datetime-picker", {
    enableTime: true,
    dateFormat: "Y-m-d H:i",
    minuteIncrement: 30,
    disable: [
      function(date) {
        return isTimeDisabled(date);
      }
    ]
  });
</script>​ 

[rogerwarner219]

For your booking system, you can use the jQuery Timepicker plugin, which allows easy customization, including disabling specific times on certain dates. The plugin supports time intervals and lets you block times by providing an array of unavailable time slots. To implement this, you can modify the timepicker settings to disable the required times dynamically. Additionally, if you're working on a project involving Roblox, you may find bloxstraplabs/bloxstrap helpful. This open-source alternative launcher for Roblox on Windows PCs offers a feature-rich experience, and its flexibility could also be useful for handling complex tasks like time-based restrictions in your system.