Going through a new django 3 project, newbie on that, so sorry me if my code is not so clean. The problem is when i try to render calendar... without events it loads nicely, but when loading'em it stops rendering the whole calendar. Console throes an Uncaught SyntaxError: Unexpected token '{', but i can´t find the problem, neither is a comma into my loop. Any help welcome. My calendar script:
<script>
document.addEventListener('DOMContentLoaded',function(){
var cUI= document.getElementById('calendar');
var c= new FullCalendar.Calendar(cUI,{
themeSystem: 'bootstrap',
headerToolbar:{
left:'prev,next today',
center:'title',
right:'',
},
events:{
{% for v in vacation %}
{
title:"{{ v.reason }}: {{ v.starth }}-{{ v.endh }}",
start: "{{ v.start | date:'Y-m-d' }}",
end: "{{ v.end | date:'Y-m-d' }}",
},
{% endfor %}
},
});
c.render();
c.setOption('locale','es');
});
</script>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>
Thank you
CodePudding user response:
The syntax error you've made is in the events
object. Because it is a javascript object, it expects key-value entries. That means you need to provide keys for your items:
events: { // <-- the `{` shows that events is an object
keyOne: { // <-- items in objects need keys (such as `keyOne`)
title: "{{ v.reason }}: {{ v.starth }}-{{ v.endh }}",
start: "{{ v.start | date:'Y-m-d' }}",
end: "{{ v.end | date:'Y-m-d' }}",
},
keyTwo: {
title: "{{ v.reason }}: {{ v.starth }}-{{ v.endh }}",
start: "{{ v.start | date:'Y-m-d' }}",
end: "{{ v.end | date:'Y-m-d' }}",
},
},
Now, if you just wanted to list these objects inside a "variable" called events
, then it should be an array:
events: [ // <-- the `[` shows that events is an array
{ // <-- items in arrays do not need keys
title: "{{ v.reason }}: {{ v.starth }}-{{ v.endh }}",
start: "{{ v.start | date:'Y-m-d' }}",
end: "{{ v.end | date:'Y-m-d' }}",
},
{
title: "{{ v.reason }}: {{ v.starth }}-{{ v.endh }}",
start: "{{ v.start | date:'Y-m-d' }}",
end: "{{ v.end | date:'Y-m-d' }}",
},
},