К сожалению, нет "сниппета", который решит вашу проблему. Календари сложны в обращении. В общем, с датами труднее работать, особенно когда вы пересекаете часовые пояса, летнее время и все такое.
Чтобы сделать то, что вы просите, вы должны изучить библиотеку, которая решает некоторые из этих проблем для вас. Для JS что-то вроде:
https://fullcalendar.io/
В зависимости от ваших клиент-серверных структур, могут существовать сторонние виджеты, которые также могут выполнять некоторые из них для вас. Например, Telerik предлагает широкий спектр опций для различных платформ:
https://demos.telerik.com/kendo-ui/scheduler/index
Если это для внутренних бизнес-целей, а не для настраиваемого / общедоступного сайта, размещенные решения, такие как Sharepoint, предлагают простые в реализации решения без кода, которые позволяют настроить календарь отслеживания событий с помощью нескольких щелчков мыши.