Display Result in Same Page Using python flask

Question

I am using python flask for sending form data into another HTML template. I need to show the result in same page where HTML input form exists. Currently response is being forwarded to next page.

I tried to run via JQuery but still unable to get the result.

app.py

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

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

@app.route('/result',methods = ['POST', 'GET'])
def result():
   if request.method == 'POST':
      result = request.form
      return render_template("result.html",result = result)

if __name__ == '__main__':
   app.run(debug = True)

index.html

<html>
   <body>
      <form action = "http://localhost:5000/result" method = "POST">
         <p>Name <input type = "text" name = "Name" /></p>
         <p>Physics <input type = "text" name = "Physics" /></p>
         <p>Chemistry <input type = "text" name = "chemistry" /></p>
         <p>Maths <input type ="text" name = "Mathematics" /></p>
         <p><input type = "submit" value = "submit" /></p>
      </form>
   <div>
   </div>
    </body>
</html>

Result.html

<!doctype html>
<html>
   <body>
      <table border = 1>
         {% for key, value in result.items() %}
            <tr>
               <th> {{ key }} </th>
               <td> {{ value }} </td>
            </tr>
         {% endfor %}
      </table>
   </body>
</html>

Now the result is displayed at result.html, i need that to be displayed on index.html. Please suggest, how to make this happen.

user15824070 · Accepted Answer · 2021-05-07 16:58:36Z

4

I know this is an older question, but for anyone else that's possibly interested. All you have to do is change

return render_template("result.html",result = result)

to

return render_template("index.html",result = result)

or to whatever other page you may want to return to. Render_template just returns whatever you ask it to, if you want to return just the data, or something else you can just say

return (data)

or whatever your data is called.

answered May 7, 2021 at 16:58

user15824070

Sign up to request clarification or add additional context in comments.

Comments

janpeterka · Accepted Answer · 2019-07-08 14:23:58Z

If I understand your problem correctly, I can see multiple ways:

1)
You can have your result.html included in your index.html.
Then you just pass your result data into render_template function.
read more about templates here

it will look something like this:

{% include 'result.html' %}

in index.html
and result.html will look like:

<div id="result_div">
  some code
</div>

2)
You can use AJAX to post form data, generate html in flask, pass it as AJAX result and update your page with it via javascript.

$.ajax({
                        type: 'POST',
                        url: '/result',
                        data: JSON.stringify({
                            'data' : data,
                        }),
                        contentType: 'application/json;charset=UTF-8',
                        success: function(response){
                            // fill with html
                            $('#result_div').html(response.result);

                        },
                        error: function(error) {
                            // console.log(error);
                        }
                    });

of course you will have to update your flask code on /results too.

In both cases, you want to have one page (which can consist of multiple html files).

Collectives™ on Stack Overflow

Display Result in Same Page Using python flask

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related