web-dev-qa-db-fra.com

Masquer l'heure de début dans FullCalendar

Sur FullCalendar, dans la vue mensuelle, existe-t-il un moyen de masquer l'heure de début d'un événement?

jqueryfullcalendar
28
Theo

Il suffit d'ajouter aux options du calendrier

displayEventTime: false
36
andrey

ajoutez le style suivant à votre css

.fc-event-time{
   display : none;
}

ou dans la version 2+:

.fc-time{
   display : none;
}
31
Riz

Essayez ceci, ça marche pour moi:

$('#calendar').fullCalendar({
     displayEventTime : false
});

Cela devrait masquer l'heure de début dans l'événement title.

14
Raymond

Ce qui suit masque la date sur la vue du mois uniquement:

.fc-view-month .fc-event-time{
    display : none;
}
11
Jayanti Gopaloodoo

Une autre méthode consiste à ajouter une fonction eventRender. De cette façon, vous pouvez choisir de ne pas afficher l'heure et de faire autre chose, comme ajouter des données à l'événement.

eventRender: function(event, element) { 
    element.find('.fc-event-title').append("<br/>" + event.location); 
    element.find('.fc-event-time').hide();
}
7
Catfish

rappelle que le nom de la classe CSS a été changé en

.fc-time {
    display:none;
}
5
AJ Hsu

Si vous voulez complètement supprimer l'heure de début, vous pouvez utiliser le code ci-dessous.

$('#calendar-canvas').fullCalendar({
    header: {
        left: 'today prev,next title',
        right: 'agendaDay,agendaWeek,month'
    },
    firstDay: 1,
    eventRender: function(event, element) {
        $(element).find(".fc-event-time").remove();
    }
});
3
Gouli Mahesh

Pour les cacher tous, ce qui suit devrait marcher

$('#calendar').fullCalendar({
 displayEventTime : false
});

Mais si vous (comme moi) essayiez de cacher le temps d'un événement spécifique, je trouvais le chemin assez propre.

Il vous suffit de créer la classe CSS suivante et de vous y référer dans la propriété d'événement "className":

.hideCalendarTime > div > span.fc-time{
    display:none;
}

Et votre événement devrait ressembler à quelque chose comme ça:

var newEvent = new Object();
newEvent.title = "Something";
newEvent.start = new Date();
newEvent.allDay = false;
newEvent.className = "hideCalendarTime";
2
Thiago A

Selon http://fullcalendar.io/docs/text/timeFormat/ , il vous suffit de définir le format de l'heure dans les paramètres fullCalendar:

$('#calendar').fullCalendar({
    events: [              
    ],
    timeFormat: ' '
});
2
Artem Pogorelov

Je sais que cela fait trois mois que vous avez posé la question. Mais, si vous et moi essayons de faire la même chose, il se peut que quelqu'un d'autre cherche la réponse. 

Dans le fichier fullcalendar.js, ligne de commentaire 1603:

htmlEscape(formatDates(event.start, event.end, view.option('timeFormat'), options)) +

Ce n'est pas une solution, au mieux c'est un hack, mais ça marche. 

2
Bill
.fc-time-grid-event.fc-short .fc-time,.fc-time-grid-event .fc-time{
        display: none !important;
    }

Le code ci-dessus le corrigera dans toutes les vues.

le code ci-dessous a un flux qui montre le temps dans une grande vue de l'événement

 .fc-time-grid-event.fc-short .fc-time{
            display: none !important;
        }

veuillez utiliser ce code en css pour masquer l'heure uniquement de l'événement.

en utilisant juste

.fc-time{
        display: none !important;
    }

masquera également le temps à gauche de la grille.

0
Ravi S. Singh

Supprimez simplement allDay: false, de votre fonction fullCalendar

0
Elyor

Bien que @Riz soit correct au moment de la publication, le css a changé dans les versions récentes et vous devez maintenant disposer des éléments suivants.

.fc-day-grid-event .fc-time{
    display:none;
}
0
Chris Traverse