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?

Solution 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.

Solution 2

You can do it before rendering, something like:

form.content.data = 'please type content'

I'm new to WTForms though.

Solution 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>'

Solution 4

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 :)

Solution 5

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)

View more solutions

Comments

[Sean Vieira]

WTForms is a server-side Python library for rendering form HTML -- jQuery will not help in this context unfortunately.

[Rasmus]

Thanks Sean! But I need to do it in the template. It is something like an edit blog link.When you click the edit button against any blog, it should present a form with the title in the textfield(which is done using the value parameter) and the content of the blog in the textarea field.

[Rasmus]

Thanks for trying to help out though!

[Rasmus]

Hi ,The form defintion, the view function and the html of the form can be viewed here:- pastebin.com/QC4MC84B

[mgoldwasser]

<script> var textarea = document.getElementById('yourIDHere'); textarea.innerHTML = "{{ your_text_variable }}" </script>

[diogovk]

That's what I wanted

[thosphor]

When I do this any data submitted is not recorded.

[Sriv]

This is the best answer! No other solution worked for me. Thanks a lot!

[DangerPaws]

Upvoting you because this is exactly what I have had to do, but I do think this is a really stupid solution! Why can't WTForms handle TextArea fields in a similar manner to how they handle regular text inputs??? Does no-one ever update text in a TextArea field???

[Shamshun]

This works! Thanks! ( gettext('Post content') is actually not needed )

[SinLey]

@thosphor and to anyone seeing this later, it's probably because the line is executed both for GET and POST requests. So, when doing a POST request, the data is overwritten with the "default" content you wanted. To fix this, just put the line in a 'if' block like so : if request.method == 'GET': form.content.data = 'please type content'