CODEWITHSUNDEEP
pythonjqueryflask
Ericson Willians
Ericson Willians

Reputation: 7845

Getting into an infinite loop with JQuery's .load()

Here's my wsgi.py:

from flask import Flask, render_template, url_for
app = Flask(__name__)

DEVELOPMENT = {}

PRODUCTION = {
    "host": "0.0.0.0",
    "port": "5000"
}

running_mode = DEVELOPMENT

@app.route('/')
def index():
    return render_template("index.html")

@app.route('/#index_content')
def index_content():
    return render_template("index_content.html")

if __name__ == '__main__':
    if running_mode:
        app.run(running_mode["host"], running_mode["port"])
    else:
        app.run()

Here's my index.html:

<!doctype html>

<html lang="en">

<head>
    <meta charset="utf-8">

    <title>Gerenciador de Adquirentes</title>
    <meta name="description" content="The HTML5 Herald">
    <meta name="author" content="Concil">
    <link rel="stylesheet" href="{{url_for('static', filename='materialize/css/materialize.min.css')}}">
    <link rel="stylesheet" href="{{url_for('static', filename='concil.css', v=0.01)}}">

</head>

<body>
    <section id="main">

    </section>
    <script src="{{url_for('static', filename='materialize/js/materialize.min.js')}}"></script>
    <script src="{{url_for('static', filename='jquery-3.3.1.min.js')}}"></script>
    <script src="{{url_for('static', filename='hashy-content.js')}}"></script>
    <script>
        $(document).ready(function () {
            $("#main").load("/#index_content");
        });
    </script>
</body>

</html>

When I use the route '/#index_content', instead of loading the contents of index_content.html, it starts making endless requests, reloading the page. It doesn't work as in this example. How can I load content in FLASK dynamically? I don't want to repeat html tags for each view.

Upvotes: 0

Views: 394

Answers (1)

dmitrybelyakov
dmitrybelyakov

Reputation: 3864

Your /#index_content route never gets hit because # is meant to be processed by the browser. It never reaches your flask backend. In fact, flask will see this javascript request as just being / (inspect request.url to see for yourself), so essentially what happens is - once the page loads, javascript simply causes a page refresh, hence the infinite loop.

I can suggest changing endpoint name to @app.route('/index_content') and hitting that.

Upvotes: 1

Related Questions