FullCalendar, Problem with drag of events and edge of the days

0

I have a section based on a fullCalendar which I use to create and move the dates of the events.

The problem I have is that when doing drag with one of the events, the border of the cells and the row where I position the cursor disappear:

My code: JS

            var calendar = $('#taskCalendar').fullCalendar({
                numberOfMonths: 3,
                height:"parent",
                aspectRatio: 1.20,
                header: {
                    left: '',
                    center: 'title',
                    right: 'prev,next today'
                },
                eventLimit: true,
                editable: true,
                monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
                monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
                dayNames: ['Domingo','Lunes','Martes','Miercoles','Jueves','Viernes','Sabado'],
                dayNamesShort: ['Dom','Lun','Mar','Mie','Jue','Vie','Sab'],
                firstDay: 1, // 1(Monday) this can be changed to 0(Sunday) for the USA system
                selectable: true,
                defaultView: 'month',
                buttonText: {
                    today: 'Hoy',
                    month: 'Mes',
                    week: 'Semana',
                    day: 'día'
                },
                dragScroll: false,
                select: function(start, end, allDay) {

                    $('.darkLayer').css('display', 'inline-block');
                    $('#addTaskModal').css('display', 'inline-block');

                    $('.addTaskModalMenuIcon.fa-list').addClass('active');
                    $('.addTaskModalMenuIcon.fa-comment-o').removeClass('active');
                    $('.addTaskModalMenuIcon.fa-user').removeClass('active');
                    $('.addTaskModalMenuIcon.fa-folder-o').removeClass('active');

                    $('.addSubtaskHiddenContent').css('display', 'inline-block');
                    $('.addChatHiddenContent').css('display', 'none');
                    $('.addParticipantHiddenContent').css('display', 'none');
                    $('.addAttachmentHiddenContent').css('display', 'none');
                    $('.wrapper-taskImage').css('display', 'inline-block');

                    $('#addInputSubtask').val("");
                    $('.changeImageInput').val("");
                    $('#datepicker2 .selectedFather2').removeClass('selectedFather2');
                    $('#datepicker2 .selectedFather').removeClass('selectedFather');

                    start   = new Date(start);
                    startd = start.getDate();
                    startm = start.getMonth() + 1;
                    starty = start.getFullYear();
                    start  = starty + "-" + startm + "-" + startd; 

                    end    = new Date(end);
                    end = sumarDias(end, -1);

                    endd   = end.getDate();
                    endm   = end.getMonth() + 1;
                    endy   = end.getFullYear();
                    end    = endy + "-" + endm + "-" + endd;

                    $('#dateRangepicker2').data('dateRangePicker').setDateRange( start , end, true);

                    $('#inputNewTaskMessage').val("");
                    $('.addTaskParticipantBoxContent').html("");
                    $('.addAttachmentContentBox').html("");
                    $('.taskImage').css('background-image', 'url("../assets/img/various/añadirfoto.jpg")');
                    $('#changeTaskImageInput').val();
                    $('.taskImage').css('outline', '2px dashed #fff');
                    $('.noImage').css('display', 'none');
                    $('#changeTaskImageInput').val('');
                    $('.addTaskTitle').html('Nueva Tarea');
                     $('#changeAddTaskTitle').val('');
                    $('.addTaskTitle').css('display', 'inline-block');
                    $('#changeAddTaskTitle').css('display', 'none');
                    $('.addTaskAlarmSelector').attr('value', '');
                    $('.addTaskAlarmSelector .addTaskAlarmSelectorText').text('AVISAME');
                    $('.addChatList').html("");
                    $('.addOpenSubtaskList').html("<div id='noAddSubtask' >No hay Subtareas</div>");
                    $('#changeOpenAddTaskSubject').val('');

                    $('.addTaskTitle').text('Nueva Tarea');
                    $('#changeAddTaskTitle').val('Nueva Tarea');

                },
                eventResize:function(event, jsEvent, ui, view){


                    taskId      = event.id;
                    dateStart   = event.start.format();
                    end         = sumarDias( new Date(event.end.format()), -1  );
                    endDay      = end.getDate();
                    endMonth    = end.getMonth()+1;
                    endYear     = end.getFullYear();

                    dateEnd = endYear + '-' + (endMonth<10 ? '0' : '') + endMonth + '-' + (endDay<10 ? '0' : '') + endDay;

                    $.ajax({
                        url: base_url + 'Task/changeDate',
                        type: 'post',
                        data:{
                            'autor'     : employeeId,
                            'taskId'    : taskId,
                            'dateStart' : dateStart,
                            'dateEnd'   : dateEnd
                        },
                        success:function(){
                        },
                        error:function(){
                        }
                    });
                },
                eventDrop:function(event, delta, revertFunc){

                    taskId    = event.id;

                    if( event.end != null )
                    {
                        dateStart   = event.start.format();
                        end         = sumarDias( new Date(event.end.format()), -1  );
                        endDay      = end.getDate();
                        endMonth    = end.getMonth()+1;
                        endYear     = end.getFullYear();

                        dateEnd = endYear + '-' + (endMonth<10 ? '0' : '') + endMonth + '-' + (endDay<10 ? '0' : '') + endDay;

                    }else{

                        dateStart   = event.start.format();
                        dateEnd     = event.start.format();

                    }

                    $.ajax({
                        url: base_url + 'Task/changeDate',
                        type: 'post',
                        data:{
                            'autor'     : employeeId,
                            'taskId'    : taskId,
                            'dateStart' : dateStart,
                            'dateEnd'   : dateEnd
                        },
                        success:function(){
                        },
                        error:function(){
                        }
                    });

                },
                eventClick:function(event, jsEvent, view){
                       $(this).addClass('active');
                }
            });
    
asked by Korzan 14.03.2018 в 19:07
source

0 answers