javascript 月、周、日标题栏按钮点击的回调?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5617194/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 17:46:49  来源:igfitidea点击:

callback for month, week, day title bar button clicks?

javascripthtmljavascript-eventsfullcalendar

提问by wired00

I need to run some javascript code to reload the calendar when the user either clicks, day/week/month buttons. Is there any callback like dayButtonClicked() or something?

当用户单击日/周/月按钮时,我需要运行一些 javascript 代码来重新加载日历。有没有像 dayButtonClicked() 之类的回调?

BUG happening:

BUG发生:

when i first load the calendar. The initial view looks fine mine initially loads day. As soon as i load another view such as week. Every single entry is duplicated and showing both sources of data. If i then click back and forward between day and month again the data is back to normal. What is happening is the removeEventSource is not being called when it first loads the new view after clicking from day to week. have you seen this happen before?

当我第一次加载日历时。初始视图看起来不错我最初加载的一天。一旦我加载另一个视图,例如周。每个条目都被复制并显示两个数据源。如果我再次在日和月之间单击来回,数据将恢复正常。发生的情况是 removeEventSource 在每天单击后首次加载新视图时没有被调用。你以前见过这种情况吗?

<script type='text/javascript'>

    $(document).ready(function() {

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();
        var loadUrl = "menu_booking.php?ne=1&calsub=1";
        var lastView;
        var fullSource = "../fullcalendar/json-events.php?idc=<?= $sClient ?>&v=long";
        var liteSource = "../fullcalendar/json-events.php?idc=<?= $sClient ?>";

        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            columnFormat: {
                month: 'ddd',
                week: 'ddd d/M',
                day: 'dddd d/M'
            },          
            defaultView: 'agendaDay',           
            firstDay: 1,            
            //editable: true,
            selectable: true,
            allDaySlot: false,
            firstHour: 7,




            viewDisplay: function(view) {
                if (lastView == undefined) { lastView = 'firstRun';  }

                if (view.name != lastView ) {

                if (view.name == 'agendaWeek') { 
                    $('#calendar').fullCalendar( 'removeEventSource', fullSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', liteSource ); 
                    $('#calendar').fullCalendar( 'addEventSource', fullSource ); 
                }
                if (view.name == 'agendaDay') { 
                    $('#calendar').fullCalendar( 'removeEventSource', fullSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', liteSource ); 
                    $('#calendar').fullCalendar( 'addEventSource', liteSource ); 
                }

                if (view.name == 'month') { 
                    $('#calendar').fullCalendar( 'removeEventSource', fullSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', liteSource ); 
                    $('#calendar').fullCalendar( 'addEventSource', fullSource ); 
                }
                lastView = view.name;
                }
            },

            timeFormat: { // for event elements
                agendaDay: '',
                agendaWeek: '',
                month: '',
                '': 'h(:mm)t' // default
            },          

        });
        //$('#calendar').limitEvents(2);
    });

</script>

I've even copied your code in exactly how you do it because i thought there was an issue with my code. even if i change to this:

我什至完全按照你的方式复制了你的代码,因为我认为我的代码有问题。即使我改成这样:

        //VIEW CHANGE - ALSO ADDS INITIAL SOURCES PER DAY VIEW
        viewDisplay: function(view) {
                $('#calendar').fullCalendar( 'removeEventSource', fullSource ); 
                $('#calendar').fullCalendar( 'removeEventSource', liteSource ); 
                $('#calendar').fullCalendar( 'addEventSource', fullSource );                }
        },

It still double loads data when i move from the default loaded view to another. I'm starting to think it is surely a bug in FullCalendar. Its driving me nuts

当我从默认加载的视图移动到另一个时,它仍然会双重加载数据。我开始认为这肯定是 FullCalendar 中的一个错误。它让我发疯

EDIT 2:MY GOD. I can't believe it finally works!

编辑2:我的上帝。我不敢相信它终于奏效了!

I have no idea why but i needed to swap around addEventSourceand removeEventSourceit now looks something like this:

我不知道为什么,但我需要交换一下addEventSourceremoveEventSource现在看起来像这样:

        viewDisplay: function(view) {
            if (lastView == undefined) { lastView = 'firstRun';  }

            //alert("viewname: "+ view.name + "lastView: " + lastView);
            if (view.name != lastView ) {
                if (view.name == 'agendaWeek') { 
                    $('#calendar').fullCalendar( 'addEventSource', shortSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', longSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', shortSource ); 
                }
                if (view.name == 'agendaDay') { 
                    //alert("in day: add litesource");
                    $('#calendar').fullCalendar( 'addEventSource', longSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', longSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', shortSource ); 
                }

                if (view.name == 'month') { 
                    //alert("in month: Delete litesource");
                    $('#calendar').fullCalendar( 'addEventSource', shortSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', longSource ); 
                    $('#calendar').fullCalendar( 'removeEventSource', shortSource ); 
                }
                lastView = view.name;
            }
        },

采纳答案by Piotr Kula

Yes - unfortunately depending on how you look at it - it could either be a feature or a bug!?! The line that is important is

是的 - 不幸的是,这取决于您如何看待它 - 它可能是一个功能或一个错误!?!重要的线是

ewDisplay: function(view) {
             if (lastView == undefined) { lastView = 'firstRun';  }
             if (view.name != lastView ){ ...

From my other post!

来自我的另一个帖子!

Why does lastView == undefined? That is because when the calendar first loads even before there is anything on screen this event fires!

为什么lastView == undefined?那是因为当日历第一次加载时,甚至在屏幕上有任何内容之前都会触发此事件!

So I make a var = lastviewan leave it undefined, when the event fires first time it assigns firstRunit can be anything really- but not the actual name of any monthViewThis step SKIPS the first event- and wont add your feed twice! I have added both these things as a bug with the developers.. but they are thinking about it- because they are arguable features..

所以我让它保持var = lastview未定义,当事件第一次触发时,它分配firstRun它可以是任何真的 - 但不是任何实际名称monthView这一步跳过第一个事件 - 并且不会两次添加您的提要!我已经将这两个东西添加为开发人员的错误..但他们正在考虑 - 因为它们是有争议的功能..

So the only thing left is to hard code a skip method- and that is why this whole lastviewis there for. I have spend 2 or 3 days trying to debug that problem; you will need to follow your code line by line and see when the feeds are being added and try to avoid it somehow.

所以唯一剩下的就是硬编码一个跳过方法——这就是为什么这整个lastview是存在的。我花了 2 到 3 天时间尝试调试该问题;您将需要逐行遵循您的代码,查看何时添加提要并尝试以某种方式避免它。

Don't forget to set the last viewnameon the end of the event.

不要忘记viewname在事件结束时设置最后一个。

    ...
       lastView = view.name;
    }

回答by Piotr Kula

Usually clicking on the view button will fire this event

通常点击查看按钮会触发这个事件

Be careful because this event will also fire if you change days on dayViews or Months in month view but you by pass that by storing a last variable

请小心,因为如果您在月视图中更改 dayViews 或 Months 上的天数,但您通过存储最后一个变量来绕过它,也会触发此事件

jQuery..

jQuery..

.
viewDisplay: function(view) { ** }
.

Replace the ** with either

将 ** 替换为

.fullCalendar( 'refetchEvents' )

It will just get your feed again. like a refresh and update any changes that might have occurred http://arshaw.com/fullcalendar/docs/event_data/refetchEvents/

它只会再次获取您的提要。像刷新并更新可能发生的任何更改 http://arshaw.com/fullcalendar/docs/event_data/refetchEvents/

or you could switch sources

或者你可以切换来源

$('#calendar').fullCalendar( 'removeEventSource', '/diaryFeed.aspx?style=Complex' ); $('#calendar').fullCalendar( 'addEventSource', '/diaryFeed.aspx?style=Basic' );   

But to find out which buttons was clicked you would need to do this

但是要找出点击了哪些按钮,您需要这样做

 eventClick: function( event, jsEvent, view ) 
             { }