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!

Answer 1

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)