14

サイトでFullCalendarプラグインを使用して、カレンダー イベントを表示しています。私が今追加しようとしているのは、名前付きのドロップダウン メニューです。ドロップダウン メニューの値が変更された場合は、メニューの値に基づいてイベントをリロードします。

別の言い方をすれば、デフォルトでは、私が所有するイベントをロードします。ドロップダウン メニューでは、すべてのユーザーが 1 つのメニューに表示されます。そのメニューから、ユーザー名を変更して、同じページで他のユーザーのイベントを表示できます。

ドロップダウン メニューに .change() イベントを追加し、fullCalendar に refetchEvents を追加しようとしましたが、機能しません。

$('#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' );
    });

});

data メソッドで user_id 値を渡すことに注意してください。

このコードはロード時に機能しますが、ドロップダウン メニューでユーザー名を変更すると、新しいイベントがリロードされません。

どうすればこれを機能させることができますか?

4

4 に答える 4

3

これを試してみてください.....この関数はイベントajaxを再び発生させます.....

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

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

}
于 2015-07-20T06:39:29.160 に答える
0 
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);
            }
        });
    });
}
于 2016-01-20T07:41:13.593 に答える