开发者

FullCalendar: How to stop dragging custom events?

开发者_如何学Go

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.


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


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.


This worked perfect for me :

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


This is the best solution:

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


i would say:

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


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".


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.


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();
        }


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


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.


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

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


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜