How to pass information from html(jinja) to python(flask) through a form

Question

I'm trying to add the possibility to comment posts (using a new post as a comment) in the blog of The Flask Mega-Tutorial. My problem is not database related. I don't know how to "link" the form to the parent post, in a way that then the comments have reference to their parents.

Here's a bit of code...

The view:

@app.route('/', methods=['GET', 'POST'])
@app.route('/index', methods=['GET', 'POST'])
@app.route('/index/<int:page>', methods=['GET', 'POST'])
@login_required
def index(page=1):
    form = PostForm()
    if form.validate_on_submit():
        post = Post(body=form.post.data, timestamp=datetime.utcnow(),author=g.user)
        db.session.add(post)
        db.session.commit()
        flash('Your post is now live!')
        return redirect(url_for('index'))
    posts = g.user.followed_posts().paginate(page, POSTS_PER_PAGE, False)
    return render_template('index.html',
                           title='Home',
                           form=form,
                           posts=posts)

The form:

class PostForm(Form):
    post = StringField('post', validators=[DataRequired()])

The portion of the index.html (post and form in the same line...)

{% for post in posts.items %}
<table>
    <tr valign="top">
        <td><img src="{{ post.author.avatar(50) }}"></td><td><p><a href="{{ url_for('user', nickname=post.author.nickname)}}">{{ post.author.nickname }}</a> said {{ momentjs(post.timestamp).fromNow() }}:</p>
<p><strong>{{ post.body }}</strong></p></td>
       </tr>
       <tr>
         <form action="" method="post" name="post">
         {{form.hidden_tag() }}
         <table>
           <tr>
             <td> <p>------------- </p> </td>
             <td>{{ form.post(size=10, maxlength=140)}}</td>
             <td>
             {% for error in form.post.errors %}
             <span> style="color: red;"[{{error}}] </span><br>
             {% endfor %}
             </td>
             <td><input type="submit" value="Reply!"></td>
         </table>
         </form>
      </tr>
</table>
{% endfor %}

And the database model for Post:

class Post(db.Model):
    __searchable__ = ['body']

    id = db.Column(db.Integer, primary_key = True)
    body = db.Column(db.String(140))
    timestamp = db.Column(db.DateTime)
    user_id = db.Column(db.Integer, db.ForeignKey('user.id'))

    parent_id = db.Column(db.Integer, db.ForeignKey('post.id'))
    children = db.relationship("Post")

    def __repr__(self):
        return '<Post %r>' % (self.body)

My idea was to add a new post as a "comment", giving to it a database reference to the old post (parent_id). How can I configure the form so it knows who is the parent (the parent_id)? Should I work on the index.html and find a way to give to the form the information about the parent post?

Thank you very much!

This answer provides a super clean way of doing this without using `flask-wtf` or `wtforms`. (https://stackoverflow.com/questions/12277933/send-data-from-a-textbox-into-flask) — David Ferris, Aug 23 '17 at 21:41

score 0 · Accepted Answer · answered Jun 28 '15 at 22:07

Techncially, you shouldn't have multiple instances of the same form on one page but…you can use a HiddenField to automatically fill in the ID of the parent post.

In your PostForm class, add a HiddenField (remember to import it: from wtforms import HiddenField):

class PostForm(Form):
    post = StringField('post', validators=[DataRequired()])
    parentID = HiddenField('', validators=[DataRequired()])

In your template add anywhere in your form tag: {{ field(value=post.id) }}.

In your validate method, add the parent ID to the creation of an instance of the post class:

def index(page=1):
    form = PostForm()
        if form.validate_on_submit():
            post = Post(body=form.post.data, parent_id=form.parentID.data, timestamp=datetime.utcnow(),author=g.user)

Thank you very much! I thought about hiddenfield but I didn't find out how to get to the end with '{{ field(value=post.id)' Why I shouldn't have multiple instances of the same form on one page? What's the better way to achieve the same results? (a lot of websites have multiple form in the same page, like facebook). Thanks again! — lorenzotenti, Jun 28 '15 at 22:23
I guess you're right, I can't think of a better way to set it up, and WTForms will automatically separate each instance of the form, so you should be good! — Youppi3, Jun 28 '15 at 22:36

How to pass information from html(jinja) to python(flask) through a form

1 Answers1