如何使用Jquery FullCalendar从另一个视图设置日历视图的日期？ [英] How do I set the date of a calendar view from another view using Jquery FullCalendar?

问题描述

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

我希望能够在第一个日历上点击月份模式中的某一天，然后将默认使用AgengaDay视图的第二个日历设置到第一个日历上点击的那一天？

我尝试了以下操作：

  $（'＃firstCalendar'）。fullCalendar（{
 
 dayClick：function（date，allDay， （'select'，date，date，allDay）; 
} 
}）; 
  

但它似乎不起作用

解决方案

这里你去 - 其实并没有那么难。点击Cal1日和Cal2变更！

http ：//jsfiddle.net/ppumkin/A56LN/

---

CODE

---

  $（'＃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'
} 
] 
}）; 
 
 $ b $（'＃mycalendar2'）。fullCalendar（
 {
 header：{
 left：'prev，next today'，
中心：'title'，
右：'month，agendaweek，agendaDay'
}，
 
 defaultView：'agendaDay'，
 
 events： [
 {
 title：'event2'，
 start：'2011-03-10'，
 end：'2011-07-25'
} 
] 
}）; 
 
 
函数dayClicked（date）{
 $（'＃mycalendar2'）。fullCalendar（'gotoDate'，date）; 
 
 code 
 
 
 
点击今日和其他按钮.. 
 
 
 
  
我有这样的代码。但这不是解决方案。因为它显示日历更改前的日期。所以基本上是旧的日期 - 也许你可以使用超时？ 500ms的？或者什么 - 因为jquery绑定在fullcalendar之前... 
  $（'。fc-button-today'）。click函数（）{
 alert（$（'＃mycalendar2'）。fullCalendar（'getDate'））; 
 // dayClicked（$（'＃mycalendar2'）。fullCalendar（'getDate'））
 
}）; 
  
您可能必须使用viewDisplay事件。但它在那里变得有点复杂。这里是一个文档如何使用它。
 
 
 
  http://arshaw.com/fullcalendar/docs/display/viewDisplay/  
  
 
 
 
查看DoomsDay answer-很好的解决方案：D 
 
 
 
 
 
一天内点击和其他按钮。
 
 
 
您可以打开fullcalendar.js并转到... 3220或搜索插槽/日期点击和绑定 
  / *槽/天单击并绑定
 ---------------------------- ------------------------------------------- * / 
 
 
函数dayBind（cells）{
 cells.click（slotClick）
 .mousedown（daySelectionMousedown）; 
 
 //在此之上插入您的个性化呼叫！ 
 setMyOtherCalendar（）; 
} 
  
，并且在您的网页某处您需要使用 setMyOtherCalendar ，它会有这个简单的代码在它的初始化队友？
  function setMyOtherCalendar（）{
 
 $（'＃mycalendar2'）。fullCalendar（'gotoDate'，$（'＃mycalendar1'）。fullCalendar（'getDate'））; 
 
}; 
  
 
I have 2 Jquery fullcalendar controls on my page.

I want to be able to click on a day on the 1st calendar which is in 'month mode', and then set the 2nd calendar which is by default using the AgengaDay view, to the day that has been clicked on the 1st calendar?

I've tried the following:
 $('#firstCalendar').fullCalendar({

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

                $('#secondcalendary').fullCalendar('select', date, date, allDay);
            }
 });
but it doesn't seem to work
解决方案
Here you go--- Its not that difficult actually. Click on the Cal1 day and the Cal2 Changes!

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



CODE



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




Clicking the "TODAY" and other buttons..


I got some code like this. but this is not the solution. because it shows the date before the calendar changes. so basically the old date- maybe you can use a time-out? 500ms? or something - because jquery binds before the fullcalendar...
$('.fc-button-today').click(function() { 
     alert($('#mycalendar2').fullCalendar( 'getDate' ));
   //dayClicked($('#mycalendar2').fullCalendar( 'getDate' ))

        });
You might have to use the viewDisplay event. But it gets a bit complicated in there. Here is a document how to use it.


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


Look at DoomsDay answer- nice solution :D



An internal hack for day click and possibly other buttons.

You can open fullcalendar.js and goto line about... 3220 or search for Slot/Day clicking and binding
/* Slot/Day clicking and binding
-----------------------------------------------------------------------*/


function dayBind(cells) {
    cells.click(slotClick)
        .mousedown(daySelectionMousedown);

   //OVER HERE INSERT YOUR CUSTOM CALL!
     setMyOtherCalendar();
}
and in your page somewhere you would havbe a public function of setMyOtherCalendar and it would have this simple code in it.. init mate?
function setMyOtherCalendar(){

  $('#mycalendar2').fullCalendar( 'gotoDate',      $('#mycalendar1').fullCalendar( 'getDate' ) );

};


                        
这篇关于如何使用Jquery FullCalendar从另一个视图设置日历视图的日期？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！