FullCalendar Limitez l'affichage des mois disponibles?

Je n'ai pas fait cela, alors je ne suis pas sûr que cela fonctionnera. Mais vous pouvez au moins essayer de voir.

Je regarderais probablement la personnalisation du rachat Code> ViewDisplay Code> Callback. Il reçoit un Objet contenant un Démarrer CODE> Propriété , entre autres. Vous pouvez utiliser les propriétés de l'objet Affichage pour tester quelle vue et la date à laquelle l'utilisateur examine l'utilisateur, puis effectuez des actions en fonction de celui-ci. P>

Je ne sais pas si FullCalendar fonctionne de cette façon, mais certains plugins vont abandonner un Action si vous retourne faux code> à partir d'un rappel. Afin que vous puissiez vérifier la date de démarrage code> CODE> et s'il est hors de votre gamme de mois acceptables, alors renvoie false code> pour abandonner l'action. P>

si cela Ne fonctionne pas, à l'intérieur de ViewDisplay code> Vous pouvez à nouveau vérifier la date code> Démarrer code>. Si le mois suivant ou le mois précédent est hors de portée, vous pouvez utiliser des sélecteurs JQuery pour saisir les boutons Prev / Next et les désactiver. De cette façon, l'utilisateur ne serait pas capable de passer à un mois hors de portée. P>

En outre, si l'utilisateur est dans un mois hors de portée, vous pouvez immédiatement émettre un goodate Commande pour passer à un mois valide. P>

$('#calendar').fullCalendar({
    viewDisplay: function(view) {
        // maybe return false aborts action? 
        if (view.start > lastDayOfNextMonth) {
            return false;
        }
        // or disable next button if this is last valid month
        if (view.end + oneDay >= lastValidDate) {
            $("#calendar #fc-button-next").attr("disabled","disabled");
        }
        // or gotoDate if view.start is out of range
        if (view.start > lastValidDate) {
           // gotoDate
        }
    }
});

Je faisais face à une situation similaire: j'ai un programme d'événements et je voulais limiter le FullCalendar à la plage de dates pour les événements (par exemple, 12 semaines). Donc, si aujourd'hui est la semaine 6, le calendrier affiche uniquement les dates de la semaine 1 à 12 lorsque l'utilisateur clique sur la prochaine ou la précédente. J'ai examiné la modification de FullCalendar.js mais je n'ai pas le temps de détourner de ma chronologie du projet. Donc, en tant que solution de contournement ici, c'est ce que j'ai fait:

1. Ajoutez un dayspicker dans un div au côté gauche de la page, avec FullCalendar à droite.
2. Définissez un démarrage et enddate pour votre gamme de dates de programme.
3. Définissez le Mindate et le MaxDate Vars à DatePicker à l'aide de StartDate et enddate pour la plage de dates de programme à DatePicker, pour griser toutes les autres dates en dehors de la gamme. Le but de ceci est d'indiquer à l'utilisateur de rester dans la gamme. En outre, j'ai ajouté du code de sorte que lorsqu'un utilisateur clique sur la date de DatePicker, la journée est affichée en FullCalendar.

4. Dans votre fichier jQuery personnalisé .js, ajoutez à la méthode FullCalendar pour DayClick qui prend la date comme variable:

   Si (+ date <+ jquery.startdate || + date> jquery.enddate) {

   var $ date_out_of_range_dialog = jQuery ('') .html ('

   Désolé, la date que vous avez sélectionnée est en dehors de la plage de dates pour le programme en cours.

   Date de début: ' + (jquery.stardate.getth () + 1) + '+' + jquery.startdate.getdate () + '+' + jquery.startdate.gedicalfinancy () + '

   date de fin: ' + (jQuery .Endated.getmonth () + 1) + '/' + jQuery.enddate.getdate () + '+ jQuery.enddate.gedicalfiny () +' ') .dialogue({ AUTOOCHEN: FALSE, modal: vrai, Titre: 'Date hors de portée', largeur: 600, boutons: { "OK": fonction () { jquery (this) .dialog ("fermer"); } } })

   $ date_out_of_range_dialog.dialog ('Open');

   } else {

   // fait quelque chose d'autre comme Afficher / Ajouter / Supprimer l'événement pour cette journée dans la plage.

   }

5. La méthode .Dialog pour ouvrir la boîte de dialogue est de MotoTools, mais quelque chose de similaire peut être utilisé dans JQuery. J'ai daté de Jquery. Pour démarrer et endormir afin que les VARS soient disponibles à travers mon fichier .js.

6. Voici le code de la date de sélection de DatePicker et de sélectionner sur FullCalendar:

   jQuery ('# datePicker_for_calendar'). DatePicker ({ DefaultDate: jquery.startdate, Mindate: jquery.startdate, maxdate: jquery.enddate, Inline: vrai, showbuttonpanel: vrai, OnSélectionnez: Fonction (DateText, Inst) { var d = nouvelle date (DateText); jquery ('# calendrier'). Fullcalendar ("gobing", d); SélectionnéDate = D; } });