重新绘制/重新渲染事件Fullcalendar

时间:2019-05-31 14:57:23

标签: jquery json fullcalendar

我正在使用FullCalendar 4开发日历。有一个模式,可以让我通过选择来带出必须显示的事件。通过ajax,我恢复了事件。这是我正在使用的代码。

$(document).ready(function (){
    loadCalendar();
});

function setting_eventos(){
'use strict';
    var form = $('#panel-setting'), form_data, message = $('.contact__msg');
    message.hide();
    form.submit(function (e) {
        e.preventDefault();
        form_data = $(this).serialize();
        console.log(form_data);
        loadCalendar(form_data);
        $("#panel-setting").modal('hide');
    });
}
function loadCalendar(param){
    op = 'has='+window.btoa(param);
    var url = get_vinculador(3649,op);    //aqui recupero la url en conjunto los parametros del modal

    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: ['interaction', 'dayGrid', 'timeGrid','list', 'rrule'],
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
        },
        locale: 'es',
        events: {
            url: url,
            failure: function () {
                document.getElementById('script-warning').style.display = 'block'
            }
        },
    });
    calendar.render();
}

<div class="modal fade" id="modal-panel-setting" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <form id="panel-setting">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row ">
                        <div class="col-md-12">
                            <div class = "row">
                                <div class = "col-md-2">
                                    <div class = "form-group">
                                        <label for = "tipoEvento">Tipos de Eventos</label>
                                        <select name = "tipoEvento"  class = "form-control plan">
                                            <option disabled = "disabled" value = "-1" selected = "selected"> ---</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class = "modal-footer">
                    <button type = "button" class = "btn btn-secondary" data-dismiss = "modal">Cancelar</button>
                    <button type = "submit" class = "btn btn-primary">Guardar</button>
                </div>
            </div>
        </div>
    </form>
</div>
 <div id='calendar'></div>

我很好地恢复了事件,但是戏剧性的是,每当我使用模式形式进行过滤时,都会再次重复显示日历,如图所示。我要做的是每次我从更新Fullcalendar网址的表单中过滤掉。

enter image description here

0 个答案:

没有答案
相关问题