jquery fullcalendar: calling events on clicking prev and next button in fullcalendar

匿名 (未验证) 提交于 2019-12-03 02:50:02

问题:

In jquery fullcalendar we have previous and next buttons. How can we call some events on click of these buttons?

回答1:

You couldsimply attach an event to the button:

$('.fc-button-prev span').click(function(){    alert('prev is clicked, do something'); });  $('.fc-button-next span').click(function(){    alert('nextis clicked, do something'); });


回答2:

best way is

 viewRender: function (view, element) {     var b = $('#calendar').fullCalendar('getDate');     alert(b.format('L'));  },


回答3:

This worked for me-

$('body').on('click', 'button.fc-prev-button', function() { //do something });  $('body').on('click', 'button.fc-next-button', function() { //do something });


回答4:

When you click them, viewRender event is triggered. You could add your code inside it as well.

$('#calendar').fullCalendar({     viewRender: function(view, element) {         //Do something     } });


回答5:

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

$(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();              new_url  = '/api/user/events/list/' + id + '/year/' + year;              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 year and the first 10 days from the next year.



回答6:

Just a quick update, no idea for how long but the accepted answer works for me like this:

$('.fc-prev-button').click(function(){    alert('prev is clicked, do something'); });  $('.fc-next-button').click(function(){    alert('nextis clicked, do something'); });

Notice slight change,

also on today click is as follows:

$(".fc-today-button").click(function () {

Hope i helped someone.



回答7:

$('.fc-button-next span').click(function(){     //do your work   });   $('.fc-button-prev span').click(function(){     //do your work   });


回答8:

Another solution is to define your custom prev/next button:

$('#m_calendar').fullCalendar({  header: {          left: 'customPrevButton,customNextButton today',          center: 'title',  },  customButtons: {                 customPrevButton: {                     text: 'custom prev !',                     click: function () {                         alert('custom prev ! clicked !');                      }                 },                 customNextButton: {                     text: 'custom ext!',                     click: function () {                        alert('custom ext ! clicked !');                     }                 },             } });


回答9:

During declaration of Calendar in events you can write the event's callback function:

$('#calender').fullCalendar({  events:  function (start, end, timezone, callback) {                     callback(eventsarray);                 } });

//eventsarray - This is a collection of data of the calendar. You can also call month wise function in this by passing first and last date of selected / current month and handle prev and next event.



易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!