php - 开始拖动时，Fullcalendar 滚动到顶部

Question

当我开始拖动事件时，总是滚动到一天的顶部（timeGridDay）。如果我在看到时拖放，从 00:00 到 08:00 的 pe 是可以的，但是如果我尝试拖动 17:00 的事件，那么我会自动移动到 00:00 - 08:00 区域顶部..我有另一个运行良好的日历...我进行了比较，我认为都是一样的..

谢谢你的帮助。

 var doubleClick = false;
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
        schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
        height: '700',
        plugins: [ 'timeGrid','dayGrid'  ,'resourceTimeGrid','interaction'],
        titleFormat: {
            year: 'numeric',
            month: 'numeric',
            day: 'numeric'
          },
        defaultView: 'timeGridDay',
        locale: lan,
        minTime: '00:00:00',
        maxTime: '23:59:00',
        allDaySlot: false,
        editable: true,
        selectable: true,
        select: function(info)
        {
            $('#newEventForm').trigger('reset');

            cadenaStr = info.startStr;
            cadenaEnd = info.endStr;

            datavisita = cadenaStr.substr(0,10);
            horainici = cadenaStr.substr(11,8);
            horafi = cadenaEnd.substr(11,8);

            $('#horastart').val(horainici);
            $('#horaend').val(horafi);
            $('#data').val(datavisita);

            $('#newEventModal').modal('show');
        },
        droppable: true,
        dragScroll: true,
        eventResourceEditable: true,
        header: {
            left:   'prev,next, addEventButton, addReserveButton',
            center: 'title',
           // right:  'resourceTimeGrid,dayGridMonth,timeGridWeek,timeGridDay'
           right: ''
        },
        
        views: {
        resourceTimeGrid: { buttonText: resbtnname },
        //dayGridMonth: { buttonText: 'month' },
        //dayGridWeek: { buttonText: 'week' },
        //dayGridDay: { buttonText: 'day' }
        },
        timeZone: 'local',

        customButtons: {
            addEventButton: {
              text: '+',
              click: function() {

                $('#newEventForm').trigger("reset");
                //alert ("passo abans client");
                //$('#client').val('').trigger('change');
                //$('#pacient').val("");
                $('#newEventModal').modal('show');
              }
            },
            addReserveButton: {
                text: '||',
                click: function() {
                    $('#newReserveModal').modal('show');
                    $('#newReserveForm').trigger('reset');

                }
            }
          },
          // title: info.event.extendedProps.pacientnom+': '+info.event.extendedProps.description,
           // tootlip show up on event mouse hover
        dayClick: function(date, jsEvent, view) {
            if(!doubleClick) {
                doubleClick = true;
                setTimeout(function() { doubleClick = false; }, 500); //this waits for a second click for the next 500ms
            }
            else {
                alert ("doble cliiiiikkkk");
                //do your double click action here (date and time available in date variable)
            }
        },
          eventRender: function(info) {
            var tooltip = new Tooltip(info.el, {
              title: info.event.extendedProps.description,
              placement: 'top',
              trigger: 'hover',
              container: 'body'
            });
            
            $(info.el).on("mousedown", function(){
             tooltip.hide();
            });
            $(info.el).on("mouseup", function(){
             tooltip.hide();
            });

            $(info.el).on("click", function(){
             tooltip.hide();
            });
             

          },

           // edit form modal show up on event click 
           eventClick: function(info) {

                $('#editsala').empty();
                $('#editpacient').empty();
                var idvisita = info.event.id;
               $('#idvisitaorg').val(idvisita);
               $('#visitaForm').submit();
              },


            // drag and drop event with database records change
          eventDrop: function( info )  {
            $('.tooltip').hide();

            //if (!confirm("Are you sure about this change?")) {
//
            //  info.revert();
            //} else {

                var id = info.event.id;
                var title = info.event.title; 

                var timeSettings = { "hour": "2-digit", "minute": "2-digit", "hour12": false };   
                var starttime = calendar.formatDate(info.event.start,  timeSettings);
                var endtime = calendar.formatDate(info.event.end,  timeSettings);
               
                var startdate =moment(info.event.start).format('YYYY-MM-DD');
                
                if(info.newResource) { 
                    var resourceId = info.newResource.id;
                } else { 
                    if(info.oldEvent.extendedProps.Resource_Id){ 
                    var resourceId = info.oldEvent.extendedProps.Resource_Id;
                    } else {
                         var resourceId =0;
                    }
                
              
                }
                

                $.ajax({
                         url: "calvis_event_dropped_update.php",
                         type: "POST",
                          data: ({
                              id: id,
                              title: title,
                              starttime: starttime,
                              endtime: endtime,
                              startdate: startdate,
                              resourceId: resourceId
                            }),
                          success: function(data){
                            calendar.refetchEvents()
                        },
                        error: function() {
                              info.revert();
                            }
                    });
            
            //}

          },

           // resize event with database records change
          eventResize: function( info )  {
               $('.tooltip').hide();
            //if (!confirm("Are you sure about this change?")) {
            //  info.revert();
            //} else {
                var id = info.event.id;
                var title = info.event.title;     
                var timeSettings = { "hour": "2-digit", "minute": "2-digit", "hour12": false };   
                var starttime = calendar.formatDate(info.event.start,  timeSettings);
                var startdate = moment(info.event.start).format('YYYY-MM-DD');
                var endtime = calendar.formatDate(info.event.end,  timeSettings);
                var resourceId=info.event.extendedProps.Resource_Id;
                //console.log(starttime);
                //console.log(endtime);
                // console.log(info.event.extendedProps.Resource_Id);

                $.ajax({
                         url: "calvis_event_dropped_update.php",
                         type: "POST",
                          data: ({
                              id: id,
                              title: title,
                              starttime: starttime,
                              endtime: endtime,
                              startdate: startdate,
                              resourceId: resourceId
                            }),
                          success: function(data){
                            calendar.refetchEvents()
                        },
                        error: function() {
                              info.revert();
                            }
                    });
            
            //}

          },

        //hide select resource for other views
          viewSkeletonRender: function(info){ 
            if(info.view.type=="resourceTimeGrid"){
             $("#resource_select_div").show();
             $("#filter_events_div").hide();
             $('#usuario_filter').val('none');
             calendar.refetchEvents();
        } else{
             $("#resource_select_div").hide();
             $("#filter_events_div").show();
        }
          },
            // generate events
           eventSources: [
            {
              url:  'calvis_get_events_caltask.php',
              method: 'POST',
              extraParams: function() {
                  return {
                    idusuario: $('#usuario_filter').val()
                  };
                },
              failure: function() {
                alert('there was an error while fetching events!');
              }
            }

            // any other sources...
          ],
          // generate resources
        resources: 'calvis_get_resources.php',
        
        });
         //render calendar
        calendar.render();

标签： phpscrollfullcalendardrag