Django 如果我使用ajax，那么日历将无法与管理模型正确同步，我真的不理解，因为它是一个外部可拖动的，我认为我需要eventReceive，因此它将是eventReceive:function（event）{}，但我不理解//收集所需数据事件以及如何收集CSRF令
Django 如果我使用ajax，那么日历将无法与管理模型正确同步，我真的不理解，因为它是一个外部可拖动的，我认为我需要eventReceive，因此它将是eventReceive:function（event）{}，但我不理解//收集所需数据事件以及如何收集CSRF令,django,django-models,django-admin,fullcalendar-3,Django,Django Models,Django Admin,Fullcalendar 3,如果我使用ajax，那么日历将无法与管理模型正确同步，我真的不理解，因为它是一个外部可拖动的，我认为我需要eventReceive，因此它将是eventReceive:function（event）{}，但我不理解//收集所需数据事件以及如何收集CSRF令牌，对不起，我真的是js jquery和ajax请求中的一个noob:( class Event(models.Model): event_name = models.CharField(max_length=255,null=True
如果我使用ajax，那么日历将无法与管理模型正确同步，我真的不理解，因为它是一个外部可拖动的，我认为我需要eventReceive，因此它将是eventReceive:function（event）{}，但我不理解//收集所需数据事件以及如何收集CSRF令牌，对不起，我真的是js jquery和ajax请求中的一个noob:(
class Event(models.Model):
event_name = models.CharField(max_length=255,null=True,blank=True)
start = models.DateTimeField(null=True,blank=True)
end = models.DateTimeField(null=True,blank=True)
available = models.BooleanField(default=True)
patient_name = models.CharField(max_length=60, null=True, blank=True)
phone_number = PhoneNumberField(blank=True,null=True)
def __unicode__(self):
return self.event_name
<script>
$(function () {
// initialize the external events
// -----------------------------------------------------------------
$('#external-events .fc-event').each(function () {
// store data so the calendar knows to render an event upon drop
$(this).data('event', {
title: $.trim($(this).text()), // use the element's text as the event title
stick: true // maintain when user navigates (see docs on the renderEvent method)
});
// 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
// -----------------------------------------------------------------
$('#calendar').fullCalendar({
eventDrop: function (event, dayDelta, minuteDelta) {
saveMyData(event);
},
eventLimit: true, // for all non-agenda views
views: {
agenda: {
eventLimit: 5 // adjust to 5 only for agendaWeek/agendaDay
}
},
buttonIcons: {
prev: 'fa-chevron-left',
next: 'fa-chevron-right',
},
themeSystem: 'bootstrap4',
header: {
left: false,
center: 'title',
right: 'prev,next today',
},
editable: true,
droppable: true, // this allows things to be dropped onto the calendar
//drop: function () {
// is the "remove after drop" checkbox checked?
// if ($('#drop-remove').is(':checked')) {
// if so, remove the element from the "Draggable Events" list
// $(this).remove();
// }
//}
});
});
</script>
<style>
html,
body {
margin: 0;
padding: 0;
font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
font-size: 14px;
}
#external-events {
width: 150px;
padding: 0 10px;
border: 1px solid #ccc;
background: #eee;
}
#external-events .fc-event {
margin: 1em 0;
cursor: move;
}
#calendar {
max-width: 900px;
margin: 20px auto;
}
</style>
{% endblock %}
<div class="container">
<div class="row calendar-row">
<div class="col-sm-10">
<div id='calendar-container'>
<div id='calendar' class="fc fc-bootstrap4 fc-ltr"></div>
</div>
</div>
<div class="col-sm-2">
<div id='external-events'>
<p>
<strong>Draggable Events</strong>
</p>
<div class="row style='z-index : 1;'">
<div class="col-sm-6">
<div class='fc-event' data-event='1' time = '08:30' data-duration='00:30'>08:30 – 09:00</div>
<div class='fc-event' data-event='1' time = '09:00' data-duration='00:30'>09:00 – 09:30</div>
<div class='fc-event' data-event='1' time = '09:30' data-duration='00:30'>09:30 – 10:00</div>
<div class='fc-event' data-event='1' time = '10:00' data-duration='00:30'>10:00 – 10:30</div>
<div class='fc-event' data-event='1' time = '10:30' data-duration='00:30'>10:30 – 11:00</div>
<div class='fc-event' data-event='1' time = '11:00' data-duration='00:30'>11:00 – 11:30</div>
<div class='fc-event' data-event='1' time = '11:30' data-duration='00:30'>11:30 – 12:00</div>
<div class='fc-event' data-event='1' time = '12:00' data-duration='00:30'>12:00 – 12:30</div>
<div class='fc-event' data-event='1' time = '12:30' data-duration='00:30'>12:30 – 13:00</div>
<div class='fc-event' data-event='1' time = '13:00' data-duration='00:30'>13:00 – 13:30</div>
<div class='fc-event' data-event='1' time = '13:30' data-duration='00:30'>13:30 – 14:00</div>
<div class='fc-event' data-event='1' time = '14:00' data-duration='00:30'>14:00 – 14:30</div>
<div class='fc-event' data-event='1' time = '14:30' data-duration='00:30'>14:30 – 15:00</div>
</div>
<div class="col-sm-6">
<div class='fc-event' data-event='1' time = '15:00' data-duration='00:30'>15:00 – 15:30</div>
<div class='fc-event' data-event='1' time = '15:30' data-duration='00:30'>15:30 – 16:00</div>
<div class='fc-event' data-event='1' time = '16:00' data-duration='00:30'>16:00 – 16:30</div>
<div class='fc-event' data-event='1' time = '16:30' data-duration='00:30'>16:30 – 17:00</div>
<div class='fc-event' data-event='1' time = '17:00' data-duration='00:30'>17:00 – 17:3</div>
<div class='fc-event' data-event='1' time = '17:30' data-duration='00:30'>17:30 – 18:00</div>
<div class='fc-event' data-event='1' time = '18:00' data-duration='00:30'>18:00 – 18:30</div>
<div class='fc-event' data-event='1' time = '18:30' data-duration='00:30'>18:30 – 19:00</div>
<div class='fc-event' data-event='1' time = '19:00' data-duration='00:30'>19:00 – 19:30</div>
<div class='fc-event' data-event='1' time = '19:30' data-duration='00:30'>19:30 – 20:00</div>
<div class='fc-event' data-event='1' time = '20:00' data-duration='00:30'>20:00 – 20:30</div>
<div class='fc-event' data-event='1' time = '20:30' data-duration='00:30'>20:30 – 21:00</div>
</div>
eventDrop: function (event, dayDelta, minuteDelta) {
saveMyData(event);
},
eventDrop: function (event, dayDelta, minuteDelta) {
// Gather the required data event, dayDelta, minuteDelta, or other
data = {
// and put it here
...,
"csrfmiddlewaretoken": "<something" // You will also need to gather the CSRF token
}
$.post( "/admin/<your_app>/event/add", data, function( data ) {
// Your code when the request succeeds
}).fail(function() {
// Your code when something fails
});
},