jQuery使用fullcalendar插件获取下个月的数据 [英] jQuery get the next month data using fullcalendar plugin

问题描述

我正在使用jQuery fullcalendar插件。

如何获得下个月的数据，即通过点击'下一步'按钮传递数据

  $（'＃calendar'）。fullCalendar（{
 events：automapic_admin.php？current_date ='+ currentdate，
 eventRender：function（event，element）{
 $（'。fc-event-title'，element）.html（event.title）; 
} 
}）; 
  

实际上，我正在使用click事件来调用下一个按钮。

  $（.fc-button-next span）。live（click，function（）{}）; 
  

解决方案

点击'next'和'previous'按钮时，

  $（document）.ready（function（）{
 loadCal（）; 
}）; 
 
函数loadCal（）{
 
 var current_url =''; 
 var new_url =''; 
 
 $（'＃calendar'）。fullCalendar（{
 
 //此处的其他选项... 
 
 events：function（start，end ，回调）{
 
 var year = end.getFullYear（）; 
 var month = end.getMonth（）; 
 $ b $ new_url ='/ api / user / （new_url！= current_url）{
 
 $。$ / $ / $ / $ + $ / $ / $ + $; ajax（{
 url：new_url，
 dataType：'json'，
 type：'POST'，
 success：function（response）{
 
 current_url = new_url; 
 user_events = response; 
 
 callback（response）; 
} 
}）
} else {
 callback（user_events ）; 
} 
} 
}）
} 
  

当您在查询中检索结果时，请确保至少包含上个月的最后10天以及下个月的前10天。这里是PHP中的一个例子：

  if（$ month === null）{
 $ month = '01 ; 
} 
 
 $ startDate = $ year。 ' - '。 $月。 -01’ ; 
 $ startDateTime = new \DateTime（$ startDate）; 
 $ startDateTime->修改（'-10天'）; 
 $ startDate = $ startDateTime->格式（'Y-m-d H：i：s'）; 
  

我决定在一个时间而不是一个月的时间内将所有事件整理一年，以减少请求，因为事件的数量很少。如果每个用户有大量的事件，那么按月抽取它们更有意义。

I am using jQuery fullcalendar plugin.

How do I get the next month data i.e passing data by clicking the 'next' button

$('#calendar').fullCalendar({
    events:"automapic_admin.php?current_date='+currentdate,
    eventRender: function(event, element) {
        $('.fc-event-title', element).html(event.title);
    }
});

Actually, I am using the click event to call the next button.

$(".fc-button-next span").live("click", function(){ });

解决方案

When the 'next' and 'previous' buttons are clicked, the events function is called. Here is an example to load data for the current year and month.

$(document).ready(function () {
    loadCal();
});

function loadCal() {

    var current_url = '';
    var new_url     = '';

    $('#calendar').fullCalendar({

        // other options here...

        events: function( start, end, callback ) {

            var year  = end.getFullYear();
            var month = end.getMonth();

            new_url  = '/api/user/events/list/' + id + '/year/' + year + '/month/' + month;

            if( new_url != current_url ){

                $.ajax({
                    url: new_url,
                    dataType: 'json',
                    type: 'POST',
                    success: function( response ) {

                        current_url = new_url;
                        user_events = response;

                        callback(response);
                    }
                })
           }else{
               callback(user_events);
           }
        }
    })
}

When you retrieve the results in a query, make sure you include at least the last 10 days from the previous month and the first 10 days from the next month. Here is an example in PHP:

if( $month === null ){
    $month = '01';
}

$startDate     = $year . '-' .  $month . '-01';
$startDateTime = new \DateTime( $startDate );
$startDateTime->modify( '-10 days' );
$startDate     = $startDateTime->format( 'Y-m-d H:i:s' );

I decided to pull all events for the whole year at a timne rather than by month to reduce requests because the number of events was low. If there are a significant number of events per user then pulling them by month makes more sense.

这篇关于jQuery使用fullcalendar插件获取下个月的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！