I want to return to about.html page from this javascript file (header.js). I wrote my header inside a javascript file. The header.js is going to be extended in every html file. When I click a button I want it to redirect to the about.html page or any other html page using url_for. I just want to figure out how to redirect from a javascript file. This is my file structure
/folder
/index.py
/templates
/index.html
/about.html
/static
/css
/js
/lib
/comp
/header.js
my header.js
class Header extends HTMLElement {
constructor() {
super();
this.html = `
<header>
<div class="wrapper">
<div id="logo-wrapper">
<img class="logo" src="images/logo3.png" alt="Jebako Logo"/>
<p id='header-name'><a href='index.html'>Jebako</a></p>
</div>
<div id="menu-wrapper">
<p id="menu-icon" class="fas fa-bars"></p>
<ul>
<li><a href="{{ Flask.url_for('about') }}">About</a></li>
<li><a href="media.html">Listen Live <span class="live"></span></a></li>
And this is my index.py
from flask import Flask, render_template, redirect, request, abort, url_for
app = Flask(__name__)
@app.route('/')
def index_page():
return render_template('index.html')
@app.route('/about/')
def about():
return render_template('about.html')
if __name__ == "__main__":
app.run(debug=True)
You don't need to use url_for. In the index.py change
app = Flask(__name__)
to
app = Flask(__name__, static_folder='/')
And you can change the html href links to:
#Or whatever you used app.route() with
href="templates/about"
You'll also need to change all existing links to use the new static folder. So like for a javascript,
<script src = "templates/about.js"></script>