How to recover all the events that are in Fullcalendar?

Question

I have a page that has a list of events that can be dragged to a Fullcalendar.

After dragging all my events to Fullcalendar and clicking the finish button I want to get a list, or something like that, with all the events and on what date this event was placed.

How can I do this using Fullcalendar in ASP.NET?

My Page (HTML)

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="FullCalendar._Default" %>


<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <div id='wrap'>
        <div id='external-events'>
            <h4>
                Servicos Complementares</h4>
            <div class='fc-event'>
                Servico 1
            </div>
            <div class='fc-event'>
                Servico 2
            </div>
            <div class='fc-event'>
                Servico 3
            </div>
            <div class='fc-event'>
                Servico 4
            </div>
            <div class='fc-event'>
                Servico 5
            </div>
            <p>
                <input type='checkbox' id='drop-remove' />
                <label for='drop-remove'>
                    Remover após a escolha da data</label>
            </p>
        </div>
        <div id='calendar'>
        </div>
        <div style='clear: both'>
        </div>
    </div>
</asp:Content>

Note that on this page I have (Service 1, Service 2, Service 3, etc).

I also a Fullcalendar on <div id='calendar'>.

I drag these services (Service 1, Service 2, Service 3, etc) into my Fullcalendar, each on a specific date.

See how it looks:

Now that the services are in the calendar I want, by clicking on a button, to get a list of the services that are in the calendar and with the respective date that each service is positioned in the calendar.

Answer 1

I believe that your best option is not to take the events at the end, but to treat the events as they are inserted in the calendar. Fullcalendar has a range of Events that can be fired as needed. Specifically the 'drop' event that triggers a function by sending as parameters 'date', 'jsEvent', 'ui'. Armaena these Events in an Object and simply send it when finished.

Note: Remember to also treat other methods for events that are changed or removed after "dropouts". The complete documentation of the events can be found at http://fullcalendar.io/docs/

EDIT:

I made a jsfiddle from the example I mentioned... It’s not professional because I was in a hurry, but it’s didactic: I made a middle fiddle in the careers, but here’s an example of what I said:

http://jsfiddle.net/romulotorres/tz30ujx8/

With this created object, you transform into what you want