简体   繁体   中英

Populate textarea field using WTForms

As I understand it, if you want to populate a textarea you place the text between the textarea tags. However I am using WTForms. How can I pre-populate the form from views or in my template?

FORM

class ModuleSectionForm(FlaskForm):
    title = StringField('Section Title', validators=[DataRequired()])
    description = TextAreaField('Description', validators=[DataRequired()])
    submit = SubmitField('Add Section')

VIEW

@modules.route('/update_section/<name>/<title>', methods=['GET', 'POST'])
def update_section(name, title):
    form = ModuleSectionForm()
    module = Module.objects(title=name).first()
    section = None
    for sect in module.sections:
        if sect.title == title:
            section = sect
    #if form.validate_on_submit():
        #save data 
    return render_template('modules/update_section.html', section=section, form=form) 

TEMPLATE

<form method="post" action="{{ url_for('modules.update_section', name=name) }}">
    {{ form.hidden_tag() }}
    <div class="form-group">
        {{ form.title.label(class="form-control-label") }}
        {{ form.title(class="form-control", value=section.title) }}
    </div>
    <div class="form-group">
        {{ form.description.label(class="form-control-label") }}
        {{ form.description(class="form-control", default=section.description) }}
    </div>
    <div class="form-group">
        {{ form.submit(class="btn btn-secondary shadow") }}
    </div>
</form>

This can be done by just assigning the text to display beforehand (in the view, for instance).

Try edit your view ( update_section ) this way:

+ form.description.data = 'text you want to display'

And your template as follows:

- {{ form.description(class="form-control", default=section.description) }}
+ {{ form.description(class="form-control") }}

Mind you, there's an alternative way, which is to specify the placeholder attribute (but I guess is not what you want to do here).

Typically with WTForms (let's assume you're using Flask and Bootstrap here), you'll use the value attribute of the input to pre-populate a form field. Note that pre-populating a field is distinct from providing a 'placeholder', which is just an ephemeral hint. So usually we pre-populate like this:

<div class="form-group row">
 <label for="form_subject" class="col-sm-2 col-form-label">Subject</label>
 <div class="col-sm-7">
  <input class="form-control" id="form_framework" name="form_framework"
value="{{ instruct.Subject }}">
 </div>
</div>

With Flask and Bootstrap, the name attribute is required to pass the value back to the Controller upon submission, the value attribute is used to pre-populate the field from the object - in this case, our controller has passed in an object called instruct, which has an attribute Subject .

But you have to be aware that different kinds of inputs in WTForms have different attributes, and this is left as a fun challenge for the developer to figure out.

TextArea doesn't have a value attribute, so in order to pre-populate the field, you have to provide the value between the tags, like so (again, using Bootstrap here in case any of these tags are unfamiliar):

<div class="form-group row">
 <label for="form_longish_text"
class="col-sm-2 col-form-label">Longish Text</label>
 <div class="col-sm-7">
  <textarea class="form-control" rows="3" 
id="form_longish_text"
name="form_longish_text">{{ instruct.LongishText }}
  </textarea>
 </div>
</div>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM