FullCalendar: How to stop dragging and dropping custom events?

Question

Can someone tell me how to stop dragging / resizing events where event.id > 100 ? Only those events should not be dragged.

Updated with sample code:

 eventRender: function(event, element) { if (event.id > 100) { event.disableDragging(); event.disableResizing(); } element.qtip({ content: GetEventToolTip(event), position: { corner: { tooltip: 'bottomLeft', target: 'topMiddle'} }, style: { border: { width: 1, radius: 5 }, padding: 5, textAlign: 'left', tip: false, name: event.iscustom == 'True' ? 'cream' : 'dark' } }); } 

Thanks.

Answer 1

Neither disableDragging nor disableResizing are functions defined in fullcalendar as of 1.4.8. I am sure that 2 people in the world have not tried the first sentence :) However, you will need to use the jQuery interface object itself to disable drag and drop or resize at the event level. Therefore (instead of trying to use non-existent functions) try this in your eventRender(event, element) :

 if (event.id > 100) { element.draggable = false; } 

Note that I am simply setting the property directly in the jQuery element, since it refers to the roaming interface.

The same goes for resizable EXCEPT, that you will need to remove the div ( class = ui-resizable-handle ui-resizable-s ) that is added by fullcalendar, identifying it with the jquery selector and deleting it (just remember to set a unique class name per event in yoru an array of events so you can easily identify it in the DOM ). Please kindly ask the fullcalendar developers (developers) to add disableDragging and disableResizing objects to the Event object. It takes less than a minute to add support to this source.

Answer 2

 eventRender: function(event, element) { if (event.id.indexOf("IDENTIFYING_STRING") == -1) { event.editable = false; } } 

Answer 3

This worked fine for me:

 if ( event.id > 100 ) { element.draggable = false; element.resizable = false; } 

Answer 4

This is the best solution:

 $('#calendar').fullCalendar({ disableDragging = true }); 

Answer 5

I would say:

 if(event.id > 100) { event.disableDragging(); event.disableResizing(); } 

Answer 6

FullCalendar v1.6.4

 eventRender: function(jsEvent, element) { if(jsEvent.id > 100) { jsEvent.startEditable = false; jsEvent.durationEditable = false; } return element; } 

This solution works for me like a charm.

I implemented this JS library with Ruby Gem "Fullcalendar_engine".

Answer 7

You need to hack fullcalendar.js

broken lines

 t.isEventDraggable = isEventDraggable; t.isEventResizable = isEventResizable; 

replace function:

 function isEventDraggable(event) { return isEventEditable(event) && !opt('disableDragging') && !event.disableDragging; } function isEventResizable(event) { // but also need to make sure the seg.isEnd == true return isEventEditable(event) && !opt('disableResizing') && !event.disableResizing; } 

Now you can enable / disable resizing and dragging for each event, as you like.

Answer 8

I have not had success with the methods shown here. I ended up hacking fullcalendar.js to add the noDragging option for events, which was actually very simple:

original:

 function isEventDraggable(event) { return isEventEditable(event) && !opt('disableDragging'); } 

changed it to:

 function isEventDraggable(event) { return isEventEditable(event) && !opt('disableDragging') && !event.noDragging; } 

Just added validation for event.noDragging .

Answer 9

For me there was no element.draggable = false and event.ediable = false . This should be due to the newer version of FullCalendar. If this is your case, try:

 if ( event.id > 100 ) { event.startEditable = false; } 

Worked for me.

Alternatively, you can cancel the move event after deleting:

 eventDrop: function (event, delta, revertFunc) { if (event.id < 100) revertFunc(); } 

Answer 10

in editable just write false, and he will not be able to drag the editable: false

Answer 11

Use these tags to create a complete calendar list to disable drag and drop or resize.

 **> $('#calendar').fullCalendar({ > > editable: false, > > //the rest of your code... }** 

Answer 12

Use these tags to create a complete calendar list to disable drag and drop or resize. The arshaw docs are not very explanatory, but here's how to interpret them.

  $('#calendar').fullCalendar({ disableResizing:true, disableDragging:true, //the rest of your code... 

disableDragging : Boolean, Default: false Disables all drag and drop events, even when events are editable.

disableResizing : Boolean, Default: false Disables event resizing, even if the events are editable.