如何使用Jquery FullCalendar从另一个视图设置日历视图的日期？

我的页面上有2个Jquery fullcalendar控件。

我希望能够点击第一个日历中处于“月份模式”的日期，然后使用AgengaDay视图将第二个日历设置为在第一个日历上单击的日期？

我尝试过以下方法：

$('#firstCalendar').fullCalendar({ dayClick: function (date, allDay, jsEvent, view) { $('#secondcalendary').fullCalendar('select', date, date, allDay); } }); 

但它似乎没有用

Answer 1

你走了 – 实际上并不困难。 单击Cal1天和Cal2更改！

http://jsfiddle.net/ppumkin/A56LN/

---

码

---

 $('#mycalendar1').fullCalendar( { header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, dayClick: function( date, allDay, jsEvent, view ) { dayClicked(date); }, events: [ { title : 'event2', start : '2011-03-10', end : '2011-07-25' } ] }); $('#mycalendar2').fullCalendar( { header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, defaultView: 'agendaDay', events: [ { title : 'event2', start : '2011-03-10', end : '2011-07-25' } ] }); function dayClicked(date){ $('#mycalendar2').fullCalendar( 'gotoDate', date ); } 

---

单击“今日”和其他按钮..

我得到了一些像这样的代码。 但这不是解决方案。 因为它显示日历更改之前的日期。 所以基本上是旧日期 – 也许你可以使用超时？ 500ms的？ 或者什么 – 因为jquery在fullcalendar之前绑定了…

 $('.fc-button-today').click(function() { alert($('#mycalendar2').fullCalendar( 'getDate' )); //dayClicked($('#mycalendar2').fullCalendar( 'getDate' )) }); 

您可能必须使用viewDisplay事件。 但它在那里变得有点复杂。 这是一个如何使用它的文档。

http://arshaw.com/fullcalendar/docs/display/viewDisplay/

看看DoomsDay的答案 – 很好的解决方案：D

---

用于日间点击的内部黑客以及可能的其他按钮。

您可以打开fullcalendar.js并转到关于… 3220的行或搜索Slot / Day点击和绑定

 /* Slot/Day clicking and binding -----------------------------------------------------------------------*/ function dayBind(cells) { cells.click(slotClick) .mousedown(daySelectionMousedown); //OVER HERE INSERT YOUR CUSTOM CALL! setMyOtherCalendar(); } 

在你的页面某个地方，你会有一个setMyOtherCalendar的公共函数，它会有这个简单的代码.init mate？

 function setMyOtherCalendar(){ $('#mycalendar2').fullCalendar( 'gotoDate', $('#mycalendar1').fullCalendar( 'getDate' ) ); }; 

Answer 2

我同意dayclick的ppumkin 。

但是仍然可以改变prev，next，today按钮的动作 。 我将使用此解决方案从＃mycalendar1导航到＃mycalendar2：

 $("#mycalendar1 .fc-button-prev").click(function() { $("#mycalendar2").fullCalendar('prev'); }); $("#mycalendar1 .fc-button-next").click(function() { $("#mycalendar2").fullCalendar('next'); }); $("#mycalendar1 .fc-button-today").click(function() { $("#mycalendar2").fullCalendar('today'); }); 

并保持ppumkin解决方案为dayClick ：

 dayClick: function( date, allDay, jsEvent, view ) { $('#mycalendar2').fullCalendar( 'gotoDate', date ); }, 

如果您使用.fullcalendar而不是#mycalendar2（如果您使用的是两个以上的日历），则应使用每个关键字。

一个例子显示在： http ： //jsfiddle.net/Doomsday/6P2CR/