How to render my TextArea with WTForms?
Question:
To render my textareafield with a specified number of columns and rows with WTForms, how do I set the number of columns and rows? I followed the instructions from this question but it didn’t work:
How to specify rows and columns of a <textarea > tag using wtforms
I tried adding a widget but it didn’t work:
class AForm(Form):
name = TextField('Name', [validators.Length(min=4)])
title = TextField('Title', [validators.Length(min=4)])
text = TextAreaField('Text', widget=TextArea(row=70, cols=11))
phonenumber = TextField('Phone number')
phonenumberhide = BooleanField('Display phone number on site')
price = TextField('Price')
password = PasswordField('Password')
email = TextField('Email', [
validators.Length(min=6, message=_('Little short for an email address?')),
validators.Email(message=_('That's not a valid email address.'))
])
TypeError: object.new() takes no parameters
Answers:
Very old question, but since the WTF-Form documentation isn’t clear I’m posting my working example. OP, hope you are not still working on this. 🙂
form
from flask_wtf import Form
from wtforms.fields import StringField
from wtforms.widgets import TextArea
class PostForm(Form):
title = StringField(u'title', validators=[DataRequired()])
body = StringField(u'Text', widget=TextArea())
template
{% extends "base.html" %}
{% block title %}Create Post{% endblock %}
{% block content %}
<H3>Create/Edit Post</H3>
<form action="" method=post>
{{form.hidden_tag()}}
<dl>
<dt>Title:
<dd>{{ form.title }}
<dt>Post:
<dd>{{ form.body(cols="35", rows="20") }}}
</dl>
<p>
<input type=submit value="Publish">
</form>
{% endblock %}
TextArea
field can be also implemented without any widgets:
forms.py
from wtforms import Form, TextField, TextAreaField
class ContactForm(Form):
name = TextField('Name')
email = TextField('Email Address')
body = TextAreaField('Message Body')
template.html
...
<form method="POST" action="">
{{ form.csrf_token }}
{{ form.name.label }} {{ form.name(size=30) }} <br/>
{{ form.email.label }} {{ form.email(size=30) }} <br/>
{{ form.body.label }} {{ form.body(cols="35", rows="20") }} <br/>
<input type="submit" value="Submit"/>
</form>
...
There is no need to update the template for this issue. You can set the rows and cols in the definition of TextAreaField
. Here is the sample:
class AForm(Form):
text = TextAreaField('Text', render_kw={"rows": 70, "cols": 11})
For render_kw
, if provided, a dictionary which provides default keywords will be given to the widget at render time.
I want to add here that the solutions above which suggest to use render_kw indeed works UNDER THE CONDITION that height for the text area IS NOT set.
so if you have a field:
temp = TextAreaField('temp', render_kw={'rows':20})
and in your HTML file you write:
{{ form.temp(class_='someclass' )}}
then in the CSS definition of someclass, height should not be set as this will conflict with your rows settings and apparently height has precedence above rows.
To render my textareafield with a specified number of columns and rows with WTForms, how do I set the number of columns and rows? I followed the instructions from this question but it didn’t work:
How to specify rows and columns of a <textarea > tag using wtforms
I tried adding a widget but it didn’t work:
class AForm(Form):
name = TextField('Name', [validators.Length(min=4)])
title = TextField('Title', [validators.Length(min=4)])
text = TextAreaField('Text', widget=TextArea(row=70, cols=11))
phonenumber = TextField('Phone number')
phonenumberhide = BooleanField('Display phone number on site')
price = TextField('Price')
password = PasswordField('Password')
email = TextField('Email', [
validators.Length(min=6, message=_('Little short for an email address?')),
validators.Email(message=_('That's not a valid email address.'))
])
TypeError: object.new() takes no parameters
Very old question, but since the WTF-Form documentation isn’t clear I’m posting my working example. OP, hope you are not still working on this. 🙂
form
from flask_wtf import Form
from wtforms.fields import StringField
from wtforms.widgets import TextArea
class PostForm(Form):
title = StringField(u'title', validators=[DataRequired()])
body = StringField(u'Text', widget=TextArea())
template
{% extends "base.html" %}
{% block title %}Create Post{% endblock %}
{% block content %}
<H3>Create/Edit Post</H3>
<form action="" method=post>
{{form.hidden_tag()}}
<dl>
<dt>Title:
<dd>{{ form.title }}
<dt>Post:
<dd>{{ form.body(cols="35", rows="20") }}}
</dl>
<p>
<input type=submit value="Publish">
</form>
{% endblock %}
TextArea
field can be also implemented without any widgets:
forms.py
from wtforms import Form, TextField, TextAreaField
class ContactForm(Form):
name = TextField('Name')
email = TextField('Email Address')
body = TextAreaField('Message Body')
template.html
...
<form method="POST" action="">
{{ form.csrf_token }}
{{ form.name.label }} {{ form.name(size=30) }} <br/>
{{ form.email.label }} {{ form.email(size=30) }} <br/>
{{ form.body.label }} {{ form.body(cols="35", rows="20") }} <br/>
<input type="submit" value="Submit"/>
</form>
...
There is no need to update the template for this issue. You can set the rows and cols in the definition of TextAreaField
. Here is the sample:
class AForm(Form):
text = TextAreaField('Text', render_kw={"rows": 70, "cols": 11})
For render_kw
, if provided, a dictionary which provides default keywords will be given to the widget at render time.
I want to add here that the solutions above which suggest to use render_kw indeed works UNDER THE CONDITION that height for the text area IS NOT set.
so if you have a field:
temp = TextAreaField('temp', render_kw={'rows':20})
and in your HTML file you write:
{{ form.temp(class_='someclass' )}}
then in the CSS definition of someclass, height should not be set as this will conflict with your rows settings and apparently height has precedence above rows.