Multiple "POST" actions : Forums : PythonAnywhere

Multiple "POST" actions

Hi All, i'm very new to flask and couldn't find an existing answer to my problem. Essentially I am trying to configure a flask website which would support the follow flow : 1) load of the default home website with menu in English. the default menu would have a 'choose language' section allowing a user to choose between English and Spanish (radio buttons) 2) upon ticking one of the radio buttons I would like the menu to change displaying all the functionalities (tick boxes with names ) in the selected language

3) the website also have a submit button which executes the underlying python nlp scripts and returns the results as a html which is then displayed to user

So far I am able to achieve 1 and 3 , but I don't know how to go about having this intermediary step 2 as I have already assign the 'POST' action to step 3 (results) bit. I am pasting below a reduced version of my code - would anyone be able to suggest a solution or point me to an example ? Many thanks

from flask import Flask, request
app = Flask(__name__)
app.config["DEBUG"] = True
@app.route("/", methods=["GET", "POST"])

def my_page():

   ##this is triggered by button click and returns the final results in html format
   if request.method == "POST":

       return  '<html><body><b>Results</b></body></html>'

   #this part is the initial menu where I would like to add an action on selection of radio buttons
   ## which would result in the whole menu appearing in Spanish
    return """<html><body>
   <form method="post" action=".">
   <b><font size="5">Choose language : </font></b>
   <input type="radio" name="options" id="option1" value="option1"> English </input>
   <input type="radio" name="options" id="option2" value="option2"> Spanish </input><br>
   <hr>
   <b><font size="5">Choose types of data to extract :</font></b><br/>
  <input name="PERSON" type="checkbox" /> Persons
 <input name="NORP" type="checkbox" /> Groups
 <p><button onclick="submit" value="Run">Run </button></p>
 </form></body></html>"""

[edit by admin: formatting]

reingo | 14 posts | Dec. 16, 2019, 9:10 p.m. | permalink

You can have multiple <form>...</form> blocks inside the same page, so you could have one covering your radio buttons at the top, and one covering the form where people enter their data and submit it lower down. Each form should go to a different view; perhaps the top one could have action="." so that it just submits to your view that has the @app.route("/"...) decorator, and then the other could have an action pointing to a different view?

giles | 224 posts | PythonAnywhere staff | Dec. 17, 2019, 12:45 p.m. | permalink

Thanks Giles, I will give this a try but how do you differentiate between an action that just does the re-routing and takes you back to a particular view and another action that meets the : if request.method == "POST": condition (bitton click) ? If I understood correctly I would start with 2 forms : 1) :
<form method="post" action="."> <input type="radio" onclick="submit" name="options" id="option1" value="option1"> English </input> </form> that would take me to some newly defined page e.g @app.route("/spanish", methods=["GET", "POST"]) etc

2 ) how should I modify the button action though ? <form method="post" action="???"> <p><button onclick="submit" value="Run">Run </button></p> </form>

reingo | 14 posts | Dec. 17, 2019, 9:26 p.m. | permalink

ok, for action I can just provide : action="/Spanish" so this now becomes a question : how can I post a request in response to clicking/selecting a radio option ? (I've tried onclick="submit" and onchange="submit" with no luck)

reingo | 14 posts | Dec. 17, 2019, 11:31 p.m. | permalink

You'd normally submit to a URL that's related to the kind of action you want to take. So (with JavaScript) you'd have something like this:

<form method="post" action="/change-language">
   <b><font size="5">Choose language : </font></b>
   <input type="radio" name="language" id="id_en" value="english"> English </input>
   <input type="radio" name="language" id="id_es" value="spanish"> Spanish </input>
   <input type="submit" value="Change language">
</form>

...handled by a view like this:

@app.route("/change-language", methods=["POST"]):
def change_language(): 
    new_language = request.form["language"]
    // do stuff

...which, when you got to the "do stuff" section, would have a variable new_language set to either "english" or "spanish".

The next step, to submit the change language form when the user clicks one of the radio buttons, would just mean that you'd need to remove the

<input type="submit" value="Change language">

...from the form, and then have an onchange handler to submit the form. The easiest way to do that would be to use jQuery, which is a JavaScript framework that makes a lot of stuff easier. I'd recommend googling it and reading up a bit, but if you have the code at the top of your template to load jQuery then the sample code in this Stack Overflow answer is a good way to go.

giles | 224 posts | PythonAnywhere staff | Dec. 18, 2019, 12:41 p.m. | permalink

thanks Giles, much appreciated

reingo | 14 posts | Dec. 19, 2019, 11:32 p.m. | permalink