WTForms-How to prepopulate a textarea field?

Question

Hi I have been trying to pepopulate a textareafield using something like this in the template.

{{form.content(value="please type content")}}

This works when the field is textfield primarily because the html accepts value for <input type="text"> but the same does not work for textarea... Can someone please help me with this?

Answer 1

For textarea widgets, you set the default content with the default argument in your field constructors.

class YourForm(Form):
    your_text_area = TextAreaField("TextArea", default="please add content")

Then when you render:

{{form.content()}}

WTForms will render the default text. I have not been able to find a way to specify default text for the text area at render time.

Answer 2

You can do it before rendering, something like:

form.content.data = 'please type content'

I'm new to WTForms though.

Answer 3

I recently had the same problem, I solved it like this:

{% set f = form.content.process_data("please type content") %}
{{ form.content() }}

For a test, you can try run the follow snippet:

>>> import wtforms
>>> import jinja2
>>> from wtforms.fields import TextAreaField
>>> class MyForm(wtforms.Form):
...     content = TextAreaField("Text Area")
... 
>>> t = jinja2.Template("""{% set f = form.content.process_data("please type content") %}
...                     {{ form.content() }}""")
>>> 
>>> t.render(form=MyForm())
u'\n                    <textarea id="content" name="content">please type content</textarea>'

Answer 4

Alice there seems to be support built into the form widget to do what you are after but you are right it doesn't work at the moment.

Sean and hilquias post decent work arounds which do work. This is the form (yuk yuk) you might try

 else:
        form.title.data=blog.title
        form.blogdata.data=blog.blogdata
    return render_template('editblog.html',form=form)

Answer 5

For those trying to do this dynamically in jinja template, setting the default value prior to rendering does not fix this problem.

Instead of using the WTForms standard:

{{ form.content() }}

You can construct this element with raw HTML like:

<textarea id="FormName-content" name="FormName-content">{{ dynamic values here }}</textarea>

...and it will still work with your WTForms validation.

Hope this helps someone :)

Answer 6

This thread is a bit old but if you need to prepopulate the textarea field with dynamic content, you could use setattr and the default parameter like so:

if post.content:

    form = EditPostForm
    setattr(form, "content", TextAreaField(gettext('Post content'), validators=[Length(max=5000)], default=post.content))
    form = EditPostForm()

else:
    form = EditPostForm()

Don't forget to import TextAreaField.

Answer 7

You can also pre-populate a textarea field by passing it in to your WTforms class instantiation in render_template (in this example I'm using the Flask framework):

@admin.route('/edit/<id>', methods=['GET', 'POST'])
def edit(id):
  if request.method == 'POST':
    form = ProspectForm(request.form)
    prospect = Prospect.objects(id=id).first()
    return render_template('admin/edit.html', prospect=prospect, prospect_form=ProspectForm(comments = prospect.comments))

So, comments=prospect.comments says "set the text inside the TextAreaField field named 'comments' to the data contained in prospect.comments"

Answer 8

Define your form with the TextArea field

class MyForm(Form):
    name = fields.StringField('Name', validators=[Required()])
    description = fields.TextAreaField('Description')

Set the textarea content before rending the template

form = MyForm()
form.description.data='this is my textarea content!' # This is the stuff...
return render_template('form.html', form=form, name=name)

Render the fields in your template

<form ...>
    {{ field(form.name, value=name) }}
    {{ field(form.description, rows=2) }}
    <button ...>Save</button>
</form>

Answer 9

In a Textarea you will need to use innerHTML or html() if you use jquery.

in your context should be:

form.content.innerHTML = "please type content";

//using jquery
$('#element').html("please type content");

Hope it helps.