Question

我有一个由FormFields组成的Wtforms FieldList，我想动态追加。

首先，FieldList为空白，并在呈现的HTML中显示为<ul>标记（此处的HTML使用示例中render_field macro Wtforms使用的检测版本进行呈现）：

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

我还创建了一个Handlebars模板，用于抓取输入并将其作为<li>附加到<ul class="form-control" id="listings">标记。数据输入正确，这是我之后的HTML

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

（注意添加到class='form-control' id='listing'对象的<li>是手动添加的，以尝试让Wtforms选择它。

但是，当我执行print(form.listings)服务器端时，它会给我以下输出：

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

有没有人知道我需要添加到Wtforms的<li>属性中的任何特殊类/属性来获取服务器端？ FWIW，如果我在提交表单之前执行console.log($(form).serialize())，那么<li>中的值就在那里。

Answer 1

您必须使用input / options / select等元素从表单中获取POST。

看看：Can we use <li> as a form element in html?

Answer 2

我怀疑问题是ID应该是唯一的。见this帖子。或者，简单地想想在这种情况下函数getElementByID将如何工作..？目前还不清楚。 因此，请使ID独一无二。

如有必要，您可以在不影响功能的情况下添加非唯一属性（如名称？）。

使用JavaScript动态地将FormField添加到Wtforms FieldList

2 个答案: