J'essaye d'utiliser le calendrier complet et la larve pour créer un système de gestion d'événements. Je suis confronté à un problème qui est que je ne sais pas comment ajouter les données dans la base de données. Créer une base de données est plus facile, mais comment la connecter et l'ajouter, la supprimer, la modifier est un peu plus difficile pour moi. Ceci est mon code pour la vue du calendrier, il peut me laisser cliquer et ajouter un événement, et faire glisser vers une autre chronologie, mais il ne se connecte pas à la base de données.

<script>
    $(document).ready(function() {
        // Check calender div is exist or not.
        // In case of guest user it will not present
        if($("#calendar").length ){
            $('#calendar').fullCalendar({
                theme: true,
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                },
                selectable:true,
                selectHelper:true,
                select: function(start, end){
                    var title = prompt('Event Title :');
                    var eventData;
                    if(title){
                        eventData = {
                            title: title,
                            start: start,
                            end:end
                        };
                        $('#calendar').fullCalendar('renderEvent',eventData,true);
                    }
                    $('#calendar').fullCalendar('unselect');
                },
                editable:true,
                eventLimit:true
            });
        }

    });
</script>

Ma question est, si je veux me connecter à la base de données. Comment ajouter dans le laravel 5.2? Les événements peuvent être ajoutés sans rafraîchir la page? Et comment réussir à ajouter l'événement dans ma base de données avec la fonction peut faire glisser? Merci pour toute suggestion et aide.

1
Arios 5 janv. 2016 à 07:33

2 réponses

Meilleure réponse

Il y a plusieurs arrêts à faire:

  1. Chargez les événements existants dans le calendrier lorsque la page est ouverte.

Utilisez la méthode de votre choix (jQuery AJAX, appels natifs JavaScript, frameworks JS réactifs, etc.) pour charger les données de votre serveur, puis les transmettre au calendrier complet comme ceci:

for(var i = 0; i < events.length; i++) {
    $('#calendar').fullCalendar('renderEvent', events[i], true);
}

Si vous n'aimez pas les appels AJAX, vous pouvez récupérer les événements existants dans Laravel et les afficher dans le modèle Blade sous forme de tableau. Mais vous aurez de toute façon besoin d'AJAX pour créer / modifier des événements, il est donc probablement préférable d'utiliser la même logique.

  1. Traiter les mises à jour du calendrier

Ensuite, lorsque l'utilisateur fait glisser / ajoute un autre événement sur le calendrier, Full Calendar appellera la méthode eventDrop, alors définissez-le dans votre bloc d'initialisation fullCalendar:

eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) {
    // This is just an example of a reverse function
    if (event.start.unix() < (Date.now() / 1000)) {
        revertFunc();
    } else {
        // Some method here that will make another AJAX call to your server and save the new event in the database
        self.addEvent(event);
    }
},

Vous aurez besoin d'un contrôleur Laravel pour gérer ces appels AJAX et je recommanderais de créer un contrôleur de ressources - il convient parfaitement ici. Vous utiliserez la méthode index () au début pour afficher tous les événements existants et vous utiliserez update (), destroy () et ainsi de suite pour modifier les événements existants.

1
Denis Mysenko 5 janv. 2016 à 05:02

Vous pouvez utiliser l'événement par défaut du fullcalendar. Il transmettra les données du formulaire json à la vue du calendrier. En gros, il aura besoin de: [{'id':'1','title':'Valentine's day','start':'01-10-2016','end':'01-11-2016'}]

Si vous pouvez obtenir le formulaire json de cette manière, puis passez à l'événement là-bas, vous pouvez alors afficher les données dans la vue du calendrier. J'espère que cette aide.

1
Ben 28 janv. 2016 à 05:49