Как перезагрузить контакт FullCalendar при изменении значения меню с помощью jQuery?

Я использую FullCalendar плагин на моем сайте для отображения событий календаря. То, что я пытаюсь добавить сейчас, - это выпадающее меню с именем, и если значение изменения выпадающего меню, то перезагрузите события на основе значения меню.

если другие слова, по умолчанию я загружаю принадлежащие мне события. Выпадающее меню будет иметь всех пользователей в одном меню. Из этого меню я могу изменить имя пользователя, чтобы просмотреть другие события пользователей на той же странице.

Я пытался добавить .событие change () в раскрывающемся меню и refetchEvents в fullCalendar, но оно не работает.

может кто-нибудь помочь мне с перезагрузкой этих событий, передав значение $('#users_menu').

ниже мой текущий код

$(document).ready(function() {

    $('#calendar').fullCalendar({

        header: {
          right: 'prev,next today',
          center: 'title',
          left: 'month,agendaWeek,agendaDay'
        },      

        events: {
            url: "ajax/getMyEvents.php",
            type: 'POST',
            data: {
                user_id: $('#users_menu').val()
            }
        },
        timeFormat: 'h:mm TT{ - h:mm} TT',
        defaultView: 'agendaDay',


        eventDrop: function(event, delta, minuteDelta, allDay, revertFunc) {

            if (!confirm("Are you sure about this change?")) {
                revertFunc();
            }
            updateEvent(event, delta, minuteDelta, allDay, 'Drop', revertFunc); 
        },

        eventResize: function(event, delta, minuteDelta, revertFunc) {

            if (!confirm("Are you sure about this change?")) {
                revertFunc();
            }
            updateEvent(event, delta, minuteDelta, false, 'endResize', revertFunc); 
        }


    });


    $('#users_menu').change( function(){

        $('#calendar').fullCalendar( 'refetchEvents' );
    });

});

обратите внимание, что я передаю значение user_id в своем методе данных.

этот код работает при загрузке, но когда я меняю имя пользователя в раскрывающемся меню, он не перезагружает новый события.

Как я могу заставить это работать?

9
fullcalendar jquery

3 ответов

Я, наконец, исправил это.

Я должен removeEventSource затем √ затем refetchEvents для этого работать, что не круто:)

вот мой код решения этой 

$('#users_menu').change(function() {

    var events = {
        url: "ajax/getMyEvents.php",
        type: 'POST',
        data: {
            user_id: $(this).val()
        }
    }

    $('#calendar').fullCalendar('removeEventSource', events);
    $('#calendar').fullCalendar('addEventSource', events);
    $('#calendar').fullCalendar('refetchEvents');
}).change();
23

попробуйте это..... эта функция снова запустит событие ajax..... 

$('#conrollerId').on('change', loadEvents);

function loadEvents() {
    $('#calendar').fullCalendar('removeEvents');
    $('#calendar').fullCalendar('refetchEvents');

}
1
function bindCal(id) {
    var ddlStudio1Value = $("#ddlStudio1 option:selected").val();
    $('#calendar').fullCalendar('addEventSource', function (start, end, timezone, callback) {
        $.ajax({
            url: '@Url.Action("GetEvents", "FacultySchedule")',
            data: "{'status':'','StudioId':'" + ddlStudio1Value + "','FacultyId':0,'start':'" + start + "', 'end':'" + end + "'}",
            dataType: "json",
            type: "POST",
            async: false,
            contentType: "application/json; charset=utf-8",
            success: function (doc) {
                var events = [];
                var EventIds = "0";
                $(doc).each(function () {
                    $('#calendar').fullCalendar('removeEvents', $(this).attr('id'));
                    events.push({
                        id: $(this).attr('id'),
                        title: $(this).attr('title'),
                        start: $(this).attr('start'),
                        end: $(this).attr('end'),
                        color: $(this).attr('color'),
                        textColor: $(this).attr('textColor'),
                        someKey: $(this).attr('someKey'),
                        allDay: $(this).attr('allDay'),
                        CreatedBy: $(this).attr('CreatedBy'),
                        StatusRemark: $(this).attr('StatusRemark'),
                        DurationMnt: $(this).attr('DurationMnt'),
                        Studio: $(this).attr('Studio')
                    });
                });
                callback(events);
            },
            error: function (response) {
                alert(response.responseText);
            }
        });
    });
}
0