I'm trying to use FullCalendar with Flask. I'd like for when a date is clicked on the calendar page, for it to redirect to a 'day' page based on that date. Right now I just want it to redirect to a day page that says that date at the top, and I'll add more formatting once I get that working.
I'm using url_for to redirect to the day page, but it doesn't seem to be passing the date to the url. It just goes to a '404 url not found' page, and the url doesn't include the date, it's just "localhost:5000/day/" when I was expecting it to be "localhost:5000/day/2023-03-09' or whatever date was selected.
I tried logging the date to the console when the date is clicked and that works. I've also tried manually going to localhost:5000/day/2023-03-09 and that takes me to the page I'm expecting as well. I can see the issue is that the date is not being passed, but I'm not sure why that's the case. Any help is greatly appreciated!
Here is the cal.html page:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.1.4/index.global.js'></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
dateClick: function(info) {
date = info.dateStr
window.location.href = {{ url_for('cal.day', date=date) }}
},
});
calendar.render();
});
</script>
</head>
<body>
<div id='calendar'></div>
</body>
</html>
and here is my routes.py:
from flask import render_template, Blueprint
cal = Blueprint('cal', __name__, template_folder='templates', static_folder='static',
static_url_path='/cal/static')
@cal.route('/', methods=['GET'])
def calendar():
return render_template('cal.html')
@cal.route('/day/<date>', methods=['GET', 'POST'])
def day(date):
date=date
return render_template('day.html', date=date)
day.html is:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
</head>
<body>
<h1>{{date}}</h1>
</body>
</html>