带弹出窗口的完整日历

时间:2015-01-16 09:38:25

标签: javascript json

我正在使用完整的日历。我有一个弹出窗口。

但问题是,如果点击带有事件的日期,它会显示弹出窗口。但是如果你点击没有事件的其他日期,它会获取上一个事件的数据。谢谢你

这里的功能:

IT是关于这个脚本的:

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultView: 'month',
        editable: true,
        allDaySlot: false,
        selectable: true,
        slotMinutes: 25,
        eventClick: function (calEvent, jsEvent, view) {

            var durationEvent = calEvent.end - calEvent.start;
            var title = $('#eventTitle').val();
            $("#popupEventForm").find("form").find("#eventTitle").attr('placeholder', calEvent.title);
            $("#eventDate").html(moment(calEvent.EventStart).format('MMM Do h:mm A'));
            //$("#popupEventForm").find("form").find("#eventDate").attr(calEvent.EventStart);

            $("#popupEventForm").find(calEvent.start).html(moment("#eventDate").format(('MMM Do h:mm A')));                  
            $('#popupEventForm').show();
        },


        eventDrop: function (event, dayDelta, minuteDelta, allDay, revertFunc) {
            if (confirm("Confirm move?")) {
                UpdateEvent(event.id, event.start);
            }
            else {
                revertFunc();
            }
        },

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

            if (confirm("Confirm change appointment length?")) {
                UpdateEvent(event.id, event.start, event.end);
            }
            else {
                revertFunc();
            }
        },

        dayClick: function (date, allDay, jsEvent, view) {


            $('#eventTitle').val("");
            $('#eventDate').val($.fullCalendar.formatDate(date, 'dd/MM/yyyy'));
            $('#eventTime').val($.fullCalendar.formatDate(date, 'HH:mm'));
            ShowEventPopup(date);
        },

        viewRender: function (view, element) {

            if (!CalLoading) {
                if (view.name == 'month') {


                    $('#calendar').fullCalendar('removeEventSource', sourceFullView);
                    $('#calendar').fullCalendar('removeEvents');
                    $('#calendar').fullCalendar('addEventSource', sourceFullView);
                }
                else {
                    $('#calendar').fullCalendar('removeEventSource', sourceSummaryView);
                    $('#calendar').fullCalendar('removeEvents');
                    $('#calendar').fullCalendar('addEventSource', sourceFullView);
                }
            }
        }

    });

    CalLoading = false;


});

但在粒子的这一部分:

var durationEvent = calEvent.end - calEvent.start;
var title = $('#eventTitle').val();  $("#popupEventForm").find("form").find("#eventTitle").attr('placeholder', calEvent.title);
$("#eventDate").html(moment(calEvent.EventStart).format('MMM Do h:mm A'));
//$("#popupEventForm").find("form").find("#eventDate").attr(calEvent.EventStart);
$("#popupEventForm").find(calEvent.start).html(moment("#eventDate").format(('MMM Do h:mm A'))); 

 $('#popupEventForm').show();

谢谢

1 个答案:

答案 0 :(得分:0)

请勿尝试使用 eventClick 功能打开模式。 使用选择, 喜欢这个

select: function (calEvent, jsEvent, view) {

            var durationEvent = calEvent.end - calEvent.start;
            var title = $('#eventTitle').val();
            $("#popupEventForm").find("form").find("#eventTitle").attr('placeholder', calEvent.title);
            $("#eventDate").html(moment(calEvent.EventStart).format('MMM Do h:mm A'));
            //$("#popupEventForm").find("form").find("#eventDate").attr(calEvent.EventStart);

            $("#popupEventForm").find(calEvent.start).html(moment("#eventDate").format(('MMM Do h:mm A')));                  
            $('#popupEventForm').show();
        },

如果您想传递所选日期,只需传递参数date

select: function (date) {
   console.log(date);
});