FullCalendar在Django [英] FullCalendar in Django
本文介绍了FullCalendar在Django的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
class Appointment（models.Model）：
user = models。 ForeignKey（User）
date = models.DateField（）
time = models.TimeField（）
doctorName = models.CharField（max_length = 50）`
我想在 FullCalendar 工具中实现它。我不知道如何开始。任何帮助表示赞赏。由于你的问题表明你还没有尝试过任何东西，猜测你知道JavaScript并尝试了一些完整的日历js的手。
假设您有一个名为Event的模型，用于在日历中显示不同的事件。
<$ c $ b $ class Event（models.Model）：
even_id = models.AutoField（primary_key = True）
event_name = models.CharField（max_length = 255，null = True，blank = True）
start_date = models.DateTimeField（null = True，blank = True）
end_date = models.DateTimeField（null = True，blank = True）
event_type = models.CharField（max_length = 10，null = True ，blank = True）
def __str __（self）：
return self.event_name
在您的views.py中
def事件（请求）：
all_events = Events.objects .all（）
get_event_types = Events.objects.only（'event_type'）
＃如果应用了过滤器，则获得para如果request.GET：
event_arr = []
if request.GET.get（'event_type'）==all：
all_events = Events.objects.all（）
else：
all_events = Events.objects.filter（event_type__icontains = request.GET.get（'event_type'））
for i in all_events：
event_sub_arr = {}
event_sub_arr ['title'] = i.event_name
start_date = datetime.datetime.strptime（str（i.start_date.date（））， （％（Y）％m-％d）。strftime（％Y-％m-％d）
end_date = datetime.datetime.strptime（str（evennddate.date（）），％Y - ％m-％d）。strftime（％Y-％m-％d）
event_sub_arr ['start'] = start_date
event_sub_arr ['end'] = end_date
event_arr.append（event_sub_arr）
return HttpResponse（json.dumps（event_arr））
context = {
events：all_events，
get_event_types：get_event_types，
return render（request，'admin / poll / event_management.html'，context）
最后在模板设置完整日历中加入必要的CSS，JS文件和HTML代码。然后，
<脚本>
$ b $（document）.ready（function（）{
$（'＃calendar'）。fullCalendar（{
defaultDate：'2016-07-19 '，
editable：true，
eventLimit：true，//当事件太多时允许更多链接
events：[
{％for i in events％}
{
title：{{i.events_name}}，
start：'{{i.start_date | date：Ymd}}'，
end：'{{ evennd_date | date：Ymd}}'，
}，
{％endfor％}
]
}）;
}）;
< / script>
动态地在某些事件中，您需要更改事件，例如通过更改下拉列表您需要过滤事件， / p>
$（document）.ready（function（）{
$（'。event_types'）。on（'change '，function（）{
var event_type = $ .trim（$（this）.val（））;
$ .ajax（{$ b $ url：{％url'manage-event '％}，
类型：'GET'，
data：{event_type：event_type}，
cache：false，
成功：函数（响应）{
var event_arr = $ .parseJSON（response）;
$（'＃calendar'）。fullCalendar（'removeEvents'）;
$（'＃calendar'）。fullCalendar（'addEventSource'，event_arr ）;
$（'＃calendar'）。fullCalendar（'rerenderEvents'）;
}，
错误：function（）{
警报（错误）;
}
}）
}）
}）
So, I have an appointment models
class Appointment(models.Model):
user = models.ForeignKey(User)
date = models.DateField()
time = models.TimeField()
doctorName = models.CharField(max_length=50)`
And I want to implement this in the FullCalendar tool. I'm not sure how to even begin. Any help is appreciated. Thanks.
解决方案
Since your question shows you haven't tried anything , guessing you know javascript and tried some hands on full calendar js.
Suppose you have model named Event for displaying different events in calendar.
class Events(models.Model):
even_id = models.AutoField(primary_key=True)
event_name = models.CharField(max_length=255,null=True,blank=True)
start_date = models.DateTimeField(null=True,blank=True)
end_date = models.DateTimeField(null=True,blank=True)
event_type = models.CharField(max_length=10,null=True,blank=True)
def __str__(self):
return self.event_name
In your views.py
def event(request):
all_events = Events.objects.all()
get_event_types = Events.objects.only('event_type')
# if filters applied then get parameter and filter based on condition else return object
if request.GET:
event_arr = []
if request.GET.get('event_type') == "all":
all_events = Events.objects.all()
else:
all_events = Events.objects.filter(event_type__icontains=request.GET.get('event_type'))
for i in all_events:
event_sub_arr = {}
event_sub_arr['title'] = i.event_name
start_date = datetime.datetime.strptime(str(i.start_date.date()), "%Y-%m-%d").strftime("%Y-%m-%d")
end_date = datetime.datetime.strptime(str(i.end_date.date()), "%Y-%m-%d").strftime("%Y-%m-%d")
event_sub_arr['start'] = start_date
event_sub_arr['end'] = end_date
event_arr.append(event_sub_arr)
return HttpResponse(json.dumps(event_arr))
context = {
"events":all_events,
"get_event_types":get_event_types,
}
return render(request,'admin/poll/event_management.html',context)
And finally in your template setup full calendar with including necessary CSS,JS Files and HTML code.And then ,
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
defaultDate: '2016-07-19',
editable: true,
eventLimit: true, // allow "more" link when too many events
events: [
{% for i in events %}
{
title: "{{ i.event_name}}",
start: '{{ i.start_date|date:"Y-m-d" }}',
end: '{{ i.end_date|date:"Y-m-d" }}',
},
{% endfor %}
]
});
});
</script>
Dynamically on some event you need to change events for example by changing dropdown you need to filter events ,
$(document).ready(function(){
$('.event_types').on('change',function(){
var event_type = $.trim($(this).val());
$.ajax({
url: "{% url 'manage-event' %}",
type: 'GET',
data:{"event_type":event_type},
cache: false,
success: function (response) {
var event_arr = $.parseJSON(response);
$('#calendar').fullCalendar('removeEvents');
$('#calendar').fullCalendar('addEventSource', event_arr);
$('#calendar').fullCalendar('rerenderEvents' );
},
error: function () {
alert("error");
}
})
})
})
这篇关于FullCalendar在Django的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
