web-dev-qa-db-fra.com

Auditeur pour "changement de date" dans FullCalendar?

Existe-t-il un moyen d'attacher un auditeur à FullCalendar qui sera déclenché chaque fois que la date actuellement affichée est modifiée, c'est-à-dire si vous êtes en vue mensuelle, passer au mois suivant déclencherait l'événement en passant la date du premier jour du mois, et il en va de même pour les semaines changeantes dans la vue Semaine, le jour dans la vue Jour, etc.

Le seul auditeur exposé qui serait proche de cela est le rappel dayClick, mais ce n'est pas bon car il ne se déclenche que lorsqu'un utilisateur clique dans la cellule d'un jour réel, pas par exemple lorsque les commandes Next/prev/today sont pressées dans la barre d'en-tête .

Je souhaite que cette fonctionnalité puisse synchroniser le mois actuellement consulté dans FullCalendar avec un composant de sélection de date ExtJS, donc si le mois affiché est modifié dans FullCalendar, le Datepicker est mis à jour pour afficher ce même mois. (pensez à l'interface utilisateur de Google Agenda avec son "mini calendrier" en haut à gauche étant le sélecteur de date).

javascriptdateextjsfullcalendardom-events
31
Bill Dami

Facture,

Je sais que cette question est assez ancienne, mais j'avais besoin d'une solution et je me suis dit que je la posterais ici pour d'autres. J'ai résolu le problème moi-même en attachant l'événement viewDisplay à mon calendrier (cet événement était supprimé dans la v2 de FullCalendar , viewRender peut être utilisé à la place).

$("#calendar").fullCalendar({
    viewDisplay: function (element) {

    }
});

Une fois que vous avez accès au paramètre d'élément, vous pouvez obtenir la date en utilisant element.start ou element.visStart. Si vous êtes dans la vue mensuelle, start vous fournira le premier jour du mois que vous visualisez, visStart vous donnera le premier jour visible du mois

26
Anthony Shaw

Voici comment je l'ai fait:

$("#calendar").fullCalendar({

viewRender: function(view, element){
        var currentdate = view.intervalStart;
        $('#datepicker').datepicker().datepicker('setDate', new Date(currentdate));
    }

    });

Dans la vue mensuelle, intervalStart renverra le premier jour du mois affiché sur le calendrier complet, plutôt que le premier jour visible, qui est généralement un jour près de la fin du mois précédent.

12
user3241874

Pour FullCalendar v4 (la dernière version au moment de la rédaction), les bons rappels sont:

viewSkeletonRender ( docs )

function( info )

Ce rappel sera déclenché lorsque la vue initiale est rendue ou lorsque l'utilisateur modifie la vue, mais avant le déclenchement du rappel de datesRender, ce qui est un rappel lorsque toutes les cellules de date/heure ont été rendues.

datesRender ( docs )

function( info )

Cela se déclenche après le rappel de viewSkeletonRender mais avant les rappels eventRender.

0
sr9yar

Pour Fullcalendar V4,

document.getElementById('my-button').addEventListener('click', function() {
  var date = calendar.getDate();
  alert("The current date of the calendar is " + date.toISOString());
});
0
ramamoorthy_villi