Add FormField to Wtforms FieldList Dynamically With JavaScript [duplicate]

Question

I have a Wtforms FieldList made up of FormFields that I want to dynamically append to.

To start out, the FieldList is blank, and it shows up as a <ul> tag in the rendered HTML (the HTML here is rendered using an instrumented version of the render_field macro Wtforms uses in examples):

<div class=" form-group field-contain  ">

   <label for="listings" class=" col-md-2 control-label">Listings</label>

      <div class="col-md-10">

         <ul class="form-control" id="listings"></ul>

      </div>
</div>

I also create a Handlebars template that I use to scrape the input and append it as an <li> to the <ul class="form-control" id="listings"> tag. The data is input correctly, here is the HTML after I've

<ul class="form-control" id="listings">
   <li class='form-control' id='listing'>
      <!-- HTML snipped for brevity -->

   </li>
   <li class='form-control' id='listing'>
     <!-- HTML snipped for brevity -- >

   </li>
</ul>

(Note the class='form-control' id='listing' added to the <li> objects were added manually to try to get Wtforms to pick it up)

However, when I do a print(form.listings) serverside it gives me the following output:

<ul id="listings"></ul>

Does anyone know of any special classes/attributes I need to add to the <li> attributes for Wtforms to pick it up serverside? FWIW, if I do a console.log($(form).serialize()) before the form is submitted, the values in the <li>s are in there.

If the above is not a duplicate, just edit the question explaining what distinguishes your situation and I'll be happy to vote for re-opening :-) — Sean Vieira
– Sean Vieira, Commented Dec 10, 2014 at 2:58

Community · Accepted Answer · 2017-05-23 11:54:06Z

0

You must use elements like inputs/options/select to get the POST from form.

Take a look at: Can we use <li> as a form element in html?

edited May 23, 2017 at 11:54

CommunityBot

11 silver badge

answered Dec 9, 2014 at 18:00

dpgaspar

1,2839 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-04-12 07:31:16Z

0

I suspect the problem is that ID's should be unique. see this post. or, simply think how would the function getElementByID work in this case..? Its unclear. So make ID's unique.

If necessary, you can add non-unique properties (like name?) without affecting functionality.

edited Apr 12, 2017 at 7:31

CommunityBot

11 silver badge

answered Dec 9, 2014 at 23:04

GG_Python

3,5415 gold badges37 silver badges50 bronze badges

Collectives™ on Stack Overflow

Add FormField to Wtforms FieldList Dynamically With JavaScript [duplicate]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related