FullCalendar: How to stop dragging custom events?

问题

Can anybody tell me how to stop dragging / resizing the events where event.id > 100? Only those events should be non draggable.

Updated with Code Sample:

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.

回答1:

Neither disableDragging nor disableResizing are functions defined in fullcalendar as of 1.4.8. I am certain that 2 people in the world haven't tried the first suggestion :) Nevertheless, you'll need to tap into the jQuery UI object itself to disable dragging or resizing at the event level. So (rather than trying to use non-existent functions) try this in your eventRender(event, element) callback:

if (event.id > 100) {

    element.draggable = false;

}

Note that I am simply setting the property on the jQuery element itself as it pertains to UI's draggable behavior.

The same goes for resizable EXCEPT that you will need to remove the div (class = ui-resizable-handle ui-resizable-s) that is appended by fullcalendar by identifying it with a jquery selector and removing it (just be sure to set a unique className per event in yoru events array so you can easily identify it in the DOM). Please kindly petition the fullcalendar developer(s) to add disableDragging and disableResizing properties to the Event object. It takes less than a minute to add support for this to the source.

回答2:

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

回答3:

This worked perfect for me :

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

回答4:

This is the best solution:

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

回答5:

i would say:

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

回答6:

FullCalendar v1.6.4

eventRender: function(jsEvent, element) {

 if(jsEvent.id > 100) {

    jsEvent.startEditable    = false;
    jsEvent.durationEditable = false;
  }

  return element;             
}

This solution has been working for me like a charm.

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

回答7:

You have to hack fullcalendar.js

uncomment lines

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

replace functions:

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 resize and dragging for every event as you like.

回答8:

Neither element.draggable = false and event.ediable = false worked for me. It must be because of the newer version of FullCalendar. If that's your case as well, try:

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

Worked for me.

Alternatively you could cancel the move event after dropping:

eventDrop: function (event, delta, revertFunc) {

            if (event.id < 100) 
                revertFunc();
        }

回答9:

in editable just write false and it wont be able to drag and drop editable: false

回答10:

I did not have success with the methods shown here. I ended up hacking fullcalendar.js to add a noDragging option for events, which was actually extremely easy:

original:

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

changed it to:

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

Just added the check for event.noDragging.

回答11:

Use these tags when creating your fullcalendar to disable dragging or resizing.

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

回答12:

Use these tags when creating your fullcalendar to disable dragging or resizing. The arshaw docs aren't very explanatory but this is how to interpret them.

 $('#calendar').fullCalendar({
    disableResizing:true,
    disableDragging:true,

    //the rest of your code...

disableDragging: Boolean, Default: false Disables all event dragging, even when events are editable.

disableResizing: Boolean, Default: false Disables all event resizing, even when events are editable.

来源：https://stackoverflow.com/questions/4001377/fullcalendar-how-to-stop-dragging-custom-events

标签

jquery

fullcalendar