首页 > 解决方案 > 如何在 Fullcalendar 中取消选择一个和多个选定日期?

问题描述

我在我的代码中使用完整的日历 js。我可以在日历中选择多个日期,但无法取消选择所选日期。我需要在哪里更改我的代码?

在 HTML 文件中

    <div class ="main-container fullcalendar-booking-course unselectCancel">
        <div id="calendar"></div>
    </div>

在我的 JS 文件中

        <script type="text/javascript">
            $(document).ready(function() {
                getFullCalendar();
        </script>
        <script type="text/javascript">

            function getFullCalendar(){
                $('#calendar').fullCalendar({

                    header: { 
                        left: 'prev,next',
                        center: 'title',
                        right: 'month,agendaWeek'
                    },
                    views: {
                        month: {
                          titleFormat: 'YYYY, MM, DD'
                        }
                    },
                    validRange: function(nowDate) {
                        return {
                          start: nowDate,
                          end: nowDate.clone().add(1, 'months')
                        };
                    },
                    navLinks: true,
                    selectable: true,
                    selectHelper: true,

                    select: function(start, end) {
                        startDate = moment(new Date(start)).format("MM-DD-YYYY");
                        endDate = moment(new Date(end)).format("MM-DD-YYYY");

                        $("#calendar").fullCalendar('addEventSource', [{
                            start: start,
                            end: end,
                            rendering: 'background',
                            block: true,
                        }]);

                        $("#calendar").fullCalendar("unselect");
                    },

                    selectOverlap: function(event) {
                        return ! event.block;
                    },

                    editable: true,
                    eventLimit: true,
                    events: function(start, end, timezone, callback){

                    },
                    eventClick: function(event, jsEvent, view) {

                    },

                    loading: function(bool) {
                        $('#loading').toggle(bool);
                    },

                    eventRender: function(event, element){

                    },

                    eventAfterAllRender: function (view) {
                        var quantity = $('.fc-bgevent').length;
                        $("#quantity").val(quantity);
                    },

                }); 
            }

        </script>

笔记:

我正在使用 fullcalendar js 文件和 CSS 文件。我已经在文档准备功能中初始化了该功能。我需要取消选择选定的日期。我可以选择多个日期,但无法取消选择日期。

标签: javascript

解决方案


推荐阅读