Как маскировать определенные даты / время в JQuery DateTimePicker

В настоящее время я пытаюсь создать систему резервирования, и я не могу понять, что использовать, чтобы блокировать даты с датой и временем. Я понял, что если кто-то резервирует дату (например, 08-15-2018 в 16:00), он блокирует весь день 8-15-2018.

Любые советы, чтобы возглавить меня в правильном направлении, очень благодарны. Это мой код, который у меня есть до сих пор. Я использую в MVC передачу моего массива datetimes для блокировки с помощью ViewBag.

     @foreach (var item in ViewBag.DatesAlreadyReserved)
     {
     <input type="hidden" value=@item id="datesReserved" />
     }
    </div>
    <div class="clearfix"></div>



    @section scripts{
        <script>

    var unavailableDates = [];

    //var unavailableDates = new Array();

    const datesReserved = document.querySelectorAll('#datesReserved');
    console.log(datesReserved.length);
    for (var i = 0; i < datesReserved.length; i++) {

        unavailableDates.push(datesReserved[i].value);
    }
    console.log(unavailableDates[1]);

    console.log(unavailableDates[2]);
    function alreadyReserved(date) {

        dmy =  (date.getMonth() + 1) + "/" + (date.getDate()) + '/' + 
    date.getFullYear();
        if ($.inArray(dmy,unavailableDates) < 0) {
            return [true,"","Reserve Now"]
        }
        else{
            return [false,"","Already Booked"]
        }

    }

    $(function () {
        $("#DateReserved").datetimepicker({
            controlType: 'select',
            oneLine: true,
            timeFormat: 'hh:mm tt',
            showMinute:false,
            beforeShowDay: alreadyReserved
        });
    });
    $(function () {
        $("#ReturnDate").datetimepicker({
            controlType: 'select',
            oneLine: true,
            timeFormat: 'hh:mm tt',
            showMinute: false,
            beforeShowDay: alreadyReserved
        });
    });

    </script>

    }