फुल कैलेंडर: ड्रैगगेबल ऑब्जेक्ट पूर्ण कैलेंडर को ड्रॉपपेल के रूप में अस्वीकार करता है भले ही पूर्ण कैलकुलेटर

छोड़ देता है मैंने ड्रॉप को स्वीकार करने के लिए पूर्ण कैलेंडर को सेट किया है, जो यह करता है। लेकिन ड्रैगगेबल ऑब्जेक्ट, जिसे मैंने वापस ले लिया है: 'अमान्य' पूर्ण कैलेंडर पर दिनांक ड्रॉप करने योग्य नहीं है, और वापस लौटता है। यहाँ मेरी कोड है:फुल कैलेंडर: ड्रैगगेबल ऑब्जेक्ट पूर्ण कैलेंडर को ड्रॉपपेल के रूप में अस्वीकार करता है भले ही पूर्ण कैलकुलेटर

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html><head> 

    <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> 
    <title>mydrag</title> 
    <script src="fullcalendar-bundle.js" type="text/javascript"></script> 
</head><body> 
<div id="mydrag" style="width: 200px; height: 100px; background-color: red;">My Drag</div> 
<div id="calendar"></div> 


<script type="text/javascript"> 
function onExternalEventDrop(date, allDay) { 
    alert("Dropped on " + date + " with allDay=" + allDay); 
} 

$('#mydrag').each(function() { 

    // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/) 
    // it doesn't need to have a start or end 
    var eventObject = { 
     title: 'MyDrag Title' 
    }; 

    // store the Event Object in the DOM element so we can get to it later 
    $(this).data('eventObject', eventObject); 

    // make the event draggable using jQuery UI 
    $(this).draggable({ 
     helper: 'clone', 
     //revert: 'invalid', 
     revert: function(droppableObj) { 
      //if false then no socket object drop occurred. 
      if(droppableObj === false) { 
       //revert the .myselector object by returning true 
       alert('Not a droppable object'); 
       return true; 
      } 
      else { 
       //droppableObj was returned, 
       //we can perform additional checks here if we like 
       //alert(droppableObj.attr('id')); would work fine 
       //return false so that the .myselector object does not revert 
       return false; 
      } 
     }, 
     revertDuration: 500, // original position after the drag 
     start: function(e, ui) { 
      $(ui.helper).css('width', $(this).css('width')); 
     } 
    }); 

}); 

$('#calendar').fullCalendar({ 
    aspectRatio: 2.25, 
    header: { 
     left: '', 
     center: 'title', 
     right: 'prev,next' 
    }, 
    columnFormat: { 
     month: 'dddd' 
    }, 
    droppable: true, 
    drop: onExternalEventDrop 
}); 

</script> 
</body></html>

जब मैं कैलेंडर पर ही खींचे जाने योग्य तत्व खींचें, तत्व वापस reverts (सुझाव है कि कैलेंडर दिनांक एक मान्य droppable रूप में मान्यता प्राप्त नहीं किया गया था) .... लेकिन ड्रॉप कॉलबैक है अपेक्षित चेतावनी के साथ ट्रिगर हुआ (सुझाव है कि फुल कैलेंडर ने ड्रैगगेबल को मान्य के रूप में पहचाना है)। मैं उम्मीद करता हूं कि ड्रैगगेबल वापस नहीं लौटना चाहिए। क्या मैं कुछ गलत कर रहा हूं या उम्मीद कर रहा हूं? मैंने पूरी तरह से खोज की है, लेकिन इसे समझाने के लिए कुछ भी नहीं मिला है। किसी भी तरह की सहायता का स्वागत किया जाएगा।

अद्यतन:

jQuery 1.5.2
jQuery ui 1.8.11
FullCalendar: उल्लेख करने के लिए, क्या मैं "FullCalendar-bundle.js" कहा जाता है निम्नलिखित वाली फ़ाइल है भूल 1.5.2 प्लगइन

एक और अपडेट: मैंने अभी पूर्ण कैलेंडर 1.5.3 रिलीज़ की कोशिश की है, लेकिन एक ही व्यवहार देखें।

स्रोत

2012-03-14 Flavius

यह आपको मदद मिल सकती है:

खींचें का काम कर रहे संस्करण और ड्रॉप: http://jsfiddle.net/wkKfB/15/

dragobj के लिए समाधान = false कि आप कैलेंडर में droppable घटना बाध्य करने की जरूरत है ताकि खींचने योग्य जानता है कि DOM ऑब्जेक्ट ड्रॉपपेल यहां काम करने का उदाहरण देखें: http://jsfiddle.net/CZQkm/3/ & & http://jsfiddle.net/DEsdN/12/ * यहां तक

(आपका संस्करण लेकिन कुछ बदलावों के साथ। तरह से मैं यहां आपकी समस्या jsfiddl-एड है द्वारा: http://jsfiddle.net/wkKfB/16/) (मुद्दा बाहरी घटना बाध्यकारी था)

अच्छा प्रलेखन यहाँ रहते हैं: http://arshaw.com/fullcalendar/docs/dropping/droppable/

अंक आप बाहर से इन खींचें घटना जोड़ने की जरूरत थी।

आप सीएसएस बदल सकते हैं और इसे अपने उपयोग में ला सकते हैं।

उद्धरण * [बाहरी ड्रैग और ड्रॉप के ऊपर उपरोक्त दस्तावेज से।] * http://arshaw.com/fullcalendar/docs/dropping/droppable/

>  How can I use this to add events??? 
>  
>  Good question. It is a common need to have an "external list of events" that can be dragged onto the calendar. 
>  
>  While the droppable option deals with generic jQuery UI draggables and is not specifically tailored to adding events, it is possible to 
> achieve this with a few lines of code. Follow the 
> external-dragging.html example in FullCalendar's download. You can 
> also view the example online. 
>  
>  In short, you must call renderEvent yourself in the drop callback.

एक और लिंक: http://arshaw.com/js/fullcalendar-1.5.3/demos/external-dragging.html

आप इस कोड को जोड़ने की जरूरत है बाहरी घटना लेकिन कैप्चर करने के लिए नमूना ऊपर आप के लिए पूरी तरह से तैयार है और स्पष्ट किया जाना चाहिए

/* initialize the external events 
    -----------------------------------------------------------------*/ 
$('#external-events div.external-event').each(function() { 

    // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/) 
    // it doesn't need to have a start or end 
    var eventObject = { 
     title: $.trim($(this).text()) // use the element's text as the event title 
    }; 

    // store the Event Object in the DOM element so we can get to it later 
    $(this).data('eventObject', eventObject); 

    // make the event draggable using jQuery UI 
    $(this).draggable({ 
     zIndex: 999, 
     revert: true,  // will cause the event to go back to its 
     revertDuration: 0 // original position after the drag 
    }); 

}); 


/* initialize the calendar 
-----------------------------------------------------------------*/

स्रोत

2012-03-24 06:02:51

फुल कैलेंडर: ड्रैगगेबल ऑब्जेक्ट पूर्ण कैलेंडर को ड्रॉपपेल के रूप में अस्वीकार करता है भले ही पूर्ण कैलकुलेटर

उत्तर

संबंधित मुद्दे