Question

我在我当前的MVC项目中使用jQuery fullcalendar和jQuery fancybox插件，我的问题是，我想在我的日历事件点击打开fancybox弹出窗口，我可以通过以下片段打开弹出窗口。

function openFancybox(object)
    {
        $.fancybox({
                    transitionIn: 'elastic',
                    transitionOut: 'elastic',
                    speedIn: 600,
                    speedOut: 200,
                    overlayShow: true,
                    type: 'inline',
                    content: '#dialogPopup',
                    onComplete: function () {
                    }
                });
                return false;
    }

这里，openFancybox是当somone点击日历事件时调用的函数。现在，我的问题是弹出窗口在单击时变为空白，但是当我再次单击它打开时，此外，我丢失了所有jQuery绑定，我用于视图上的其他控件，即下拉更改事件，按钮单击事件等。

以下是我的pop up div片段和ajax来填充div中的PartialView数据

<div id="dialogPopup" class="add-job-block">
</div>


$.get("/Events/LoadData", { id: object.id }, function (data) {
                if (data != undefined && data != "") {
                    $("#dialogPopup").html("");
                    $("#dialogPopup").html(data);
                    //$.uniform.restore();
                    //$(".styled, input:radio, input:checkbox, .dataTables_length select").not('.no-uniform').uniform();
                }
            });

我还使用了jQuery uniform插件来设置下拉列表和其他输入控件的样式。完整的功能片段如下，

function openFancybox()
{
           $.get("/Events/LoadData", { id: object.id }, function (data) {
                    if (data != undefined && data != "") {
                        $("#dialogPopup").html("");
                        $("#dialogPopup").html(data);
                        //$.uniform.restore();
                        //$(".styled, input:radio, input:checkbox, .dataTables_length select").not('.no-uniform').uniform();
                    }
                });


             $.fancybox({            
                        transitionIn: 'elastic',
                        transitionOut: 'elastic',
                        speedIn: 600,
                        speedOut: 200,
                        overlayShow: true,
                        type: 'inline',
                        content: '#dialogPopup',
                        onComplete: function () {
                        }
                    });
                    return false;


}

我从日历插件调用中调用函数，即

 var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
    var calendar = $('#calendar').fullCalendar({
        //theme: true,
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'resourceDay,month,agendaWeek,agendaDay'
        },
        eventClick: updateEvent,
        ignoreTimezone: true,
        disableResizing: false,
        disableDragging: false,
        selectable: true,
        selectHelper: true,
        select: selectDate,
        editable: true,
        resources: "/Calendar/EventsResourceList",
        events: "/Calendar/EventsList",
        eventResize: eventResizedCompleted,
        eventDrop: eventDragCompleted,
        eventAfterRender: function (event, element, view) {
            Date.prototype.formatMMDDYYYY = function () {
                return this.getMonth() +
            "/" + this.getDate() +
            "/" + this.getFullYear();
            }
            var eventDate = new Date(event.start);
            var todaysDate = new Date();
            if (todaysDate.formatMMDDYYYY() === eventDate.formatMMDDYYYY()) {
                setInterval(function () {
                    element.fadeOut(500).delay(300).fadeIn(400);
                }, 2000);
            }

        }
    }); 

function updateEvent(event, element) {
   openFancybox({ id: event.id, jobid: event.JobID });
}

所以，我的问题是弹出来了2次点击，同样，我从控件中丢失了所有jQuery绑定，所以任何人有任何建议或调整或解决方案或经历过这个问题对我有帮助。

jQuery fancybox popup问题与fullcalendar事件点击与MVC

0 个答案: