Preview field not shown when there are more than one PageDownField

[nalzok]

Seems that only the first PageDownField is handled properly when rendering. I suppose this is caused by the js code in {{ pagedown.include_pagedown() }}.

See this SO question

[miguelgrinberg]

Flask-PageDown uses the name of the field to build the id attribute used in the form's HTML output. If the two forms have the same pagedown field name, then the ids are going to collide. Try using different names for the two fields.

I think what I need to do here is use the form name and the field name together, to have more unique id names.

[nalzok]

Using different names for fields is not easy to me, for they are automatically generated in my application:

template.html

{% for answer in answers %}
    ......
    <div>
        {{ wtf.quick_form(comment_form) }}
    </div>
{% endear %}

forms.py

class CommentForm(Form):
    receiver = StringField('User to notify (Optional)',
            render_kw={"placeholder": "Student ID / Username"})
    body = PageDownField('Comment', \
            validators=[InputRequired()], \
            render_kw={"placeholder": "Be polite", })
    is_anonymous = BooleanField('Make anonymous')
    submit = SubmitField('Post')

I've tried adding an id attribute in render_kw, but that would give me TypeError: __call__() got multiple values for keyword argument 'id'

[miguelgrinberg]

There is actually a problem with your implementation.

You cannot render the same form multiple times in the page. If you need one form per answer, then your Python script needs to create all these forms, and then for each answer you render the form that belongs to it.

Once you have that implemented, you can make field names and ids unique by adding a prefix to each form. For example, you can use the id of your answer as a prefix, by passing it to the form constructor:

form = CommentForm(prefix=answer.id)

And with this, each form will use the prefix in all the field names and ids.

[nalzok]

Thanks to your advice, I've solved this problem now! However, it seems that prefix only accepts strings, so I had to write:

form = CommentForm(prefix=str(answer.id))

[miguelgrinberg]

Awesome, glad you were able to solve your problem.