1

I know this may be trivial but I can't seem to figure out how to send user submitted data on my webpage to the server side. I am making a simple web app that takes in a users' word and then counts the number of syllables on the server side using Python.

I render the page using flask:

@app.route('/')
def hello():
  webPage = open('pg.html','r')
  return webPage.read()

In JavaScript I have a form:

<form method="get"><br><br> 
  Enter a Word: <br>
 <input type="text" name="name"><br><br>
 <input type="submit" value="Submit">
         </form>

When the user submits a word to this form, how do I retrieve it with Python ?

I've read around about GET and POST methods but I am still pretty confused.

  • 1
    A form is a `POST` request to an action. Have a look at [this](http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-iii-web-forms) – Ali Gajani May 19 '15 at 16:11

1 Answers1

0

Considering you know about GET and POST, here is the important bits.

Show the home(hello) page

from flask import render_template

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

Now, in the hello.html (notice the action and method):

<html>
    <head></head>
    <body>
        <form method="POST" action="/testpost">
            Enter a Word: <br>
            <input type="text" name="name"><br><br>
            <input type="submit" value="Submit">
        </form>
    </body>
</html>

If you notice, the method is POST that means, your data is a sent as a POST to the server. Now to handle the POST request, we can consider the following:

Now POST handling

@app.route('/testpost', methods = ['POST'])
def postTesting():
    name = request.form['name']
    print name #This is the posted value

You see, the request.form contains the parsed form data.

Nagaraj Tantri
  • 4,572
  • 10
  • 47
  • 72
  • Now, one question, what exactly is action = "/testpost" doing? Is it that creating a new page? – Desean Abraham May 19 '15 at 16:44
  • @DeseanAbraham It's a URL to your `POST`. (The URI of a program) So, when you say: `action="/testpost"`, it means a url as "http://localhost/testpost" with `POST` data. (considering localhost is your hosted server) – Nagaraj Tantri May 19 '15 at 16:47
  • It's kind of necessary if you want to send the data. (not the only way). "testpost" is just an example. You can provide any URI name you wish. it will post your data to that URI. Check [this](http://stackoverflow.com/questions/3477333/what-is-the-difference-between-post-and-get) and [this](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/Sending_and_retrieving_form_data) – Nagaraj Tantri May 19 '15 at 16:56
  • Okay, I'm having one problem. When I submit to the form and it attempts to redirect to this new URL I get a URL NOT FOUND error. – Desean Abraham May 19 '15 at 17:01
  • The `URL not found` simply means the `app.route` is not having the same. It should have been added somewhere. – Nagaraj Tantri May 19 '15 at 17:04
  • The `app.route` has the same URL as does the form in `JavaScript`. I'm not sure why I am getting this error. – Desean Abraham May 19 '15 at 17:14
  • Is it perhaps beacuse I am using `urlib` and you are using `render_template` to display the page? – Desean Abraham May 19 '15 at 17:15
  • Just try to check how the app.route is usually defined. Check for `app = Flask(__name__)` after you import Flask. I'm not able to give you proper help now because I'm using my phone. – Nagaraj Tantri May 19 '15 at 17:34