Josep
Josep

Reputation: 51

Fullcalendar: group events on the same day in a single event

I have a Fullcalendar with the week view.

I have modified fullcalendar to show a number with the event:

function slotSegHtml(event, seg) {

[...]

    html +=
        " class='" + classes.join(' ') + "'" +
        " style='position:absolute;z-index:8;top:" + seg.top + "px;left:" + seg.left + "px;" + skinCss + "'" +
        ">" +

                    "<span class='fc-event-inner fc-event-qty'>"+htmlEscape(event.qty)+"</span>"+                              

[...]
    return html;
}

in the drop function:

        drop: function(date, allDay) { // this function is called when something is dropped

            // retrieve the dropped element's stored Event Object
            var originalEventObject = $(this).data('eventObject');

            // we need to copy it, so that multiple events don't have a reference to the same object
            var copiedEventObject = $.extend({}, originalEventObject);

            // assign it the date that was reported
                            copiedEventObject.id = idevento++;
            copiedEventObject.start = date;
            copiedEventObject.allDay = allDay;

                            copiedEventObject.className = 'newEvent';
                            copiedEventObject.qty = '1';



                            //buscar eventos
                            var listevents = $('#calendar').fullCalendar('clientEvents',function(event) {
                                if(date.getFullYear()!=event.start.getFullYear())return false;

                                if(date.getMonth()!=event.start.getMonth())return false;

                                if(date.getDay()!=event.start.getDay())return false;

                                if(date.getHours()!=event.start.getHours())return false;     


                                //aparte tienen que ser del mismo tipo
                                if(event.title!=copiedEventObject.title)return false;

                                return true;
                            });


                            if(typeof listevents === 'object'){

                                //augmentar la cantidad
                                eventoantiguo = listevents[0];

                                copiedEventObject.qty = parseInt(eventoantiguo.qty)+1;

                                //borrar el objeto antiguo
                                $("#calendar").fullCalendar('removeEvents', eventoantiguo.id);

                            }

            // render the event on the calendar
            // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)


                            $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);


            // is the "remove after drop" checkbox checked?
            if ($('#drop-remove').is(':checked')) {
                // if so, remove the element from the "Draggable Events" list
                $(this).remove();
            }

        },

but when I drop the second event in the same day and hour, all events disapear.

sorry for my english.

I think the blame line is: $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

firebug says: Uncaught TypeError: Object 2 has no method 'replace'

in this function

 function htmlEscape(s) {
      return s.replace(/&/g, '&amp;')
      .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/'/g, '&#039;')
    .replace(/"/g, '&quot;')
    .replace(/\n/g, '<br />');
 }

(fullcalendar.js)

Upvotes: 0

Views: 6999

Answers (2)

Dipesh
Dipesh

Reputation: 371

Use Eventlimit of Full Calendar , Suppose You want to Group all Events of Single day then Just set limit of event to 1 as follows:

$('#divCalendar').fullCalendar({                    
                        theme: true,
                        eventLimit: true, // for all non-agenda views
                        eventLimit: 1,
......
further code

Upvotes: 2

Josep
Josep

Reputation: 51

I solved the problem with this line:

 copiedEventObject.qty = (parseInt(eventoantiguo.qty)+1)+'';//se tiene que convertir a string!

because function "function htmlEscape(s) {" "s" must be an string

Thank you!

Upvotes: 1

Related Questions