在撇号 CMS 中使用自定义联系人表单模块时提交失败

Question

我正在关注 https://docs.apostrophecms.org/apostrophe/tutorials/intermediate/forms 的"更深入"部分，但我想控制表单标记的输出，而不是使用schema：macro.html允许。我能够很好地在页面上填充表单，但是当我尝试提交时，我收到"有些不对劲"警报。这基本上意味着在apos.schemas.convert((调用中的某个地方存在错误。但我似乎无法弄清楚错误在哪里。

我几乎复制了上面列出的 tuturial，除了小部件.html这是我自己的表单标记版本。

因此，我lib/modules/contact-form/index.js, lib/modules/contact-form-widgets/index.js and /lib/contact-form-widgets/always.js中的代码几乎都是与 tuturial 中的内容完全相同的代码，因此为了简洁起见，我不会在此处复制它们。以下是我对如何输出表单字段lib/modules/contact-form-widgets/views/widget.html：

<div class="container">
<div class="row">
<div class="col-md-12">
<form class="form contact-form mt-5" id="contactForm" data-contact-form>
{% for field in data.schema %}
{% if field.type === 'string' and field.textarea %}
<div class="form-group">
<label class="input-label" for="{{field.name}}">{{field.label}}</label>
<textarea class="textarea-input" id="{{field.name}}" name="{{field.name}}" rows="5" placeholder="Type here"></textarea>
</div>
{% elif field.type === 'select' %}
<div class="form-group">
<label class="input-label" for="{{field.name}}">{{field.label}}</label>
<select class="select-input" name="{{field.name}}">
<option>Choose below...</option>
{% for choice in field.choices %}
<option value="{{choice.value}}">{{choice.label}}</option>
{% endfor %}
</select>
</div>
{% else %}
<div class="form-group">
<label class="input-label" for="{{field.name}}">{{field.label}}</label>
<input class="form-input" type="text" id="{{field.name}}" name="{{field.name}}" placeholder="{{field.label}}" value=""/>
</div>
{% endif %}
{% endfor %}
<button class="btn primary" type="submit">Submit</button>
{# Later gets hoisted out and becomes visible #}
<div class="thank-you" style="display: none;" data-thank-you>
<h4>Thank you for getting in touch! We'll respond soon.</h4>
</div>
</form>
</div>
</div>

预期成果将是成功提交。任何帮助将不胜感激。到目前为止，我喜欢撇号平台。

Answer 1

因此，在查看了 apostrophe-schemas/views/macros.html 内部包含的内容并进行调查之后，如果发现我没有包含我缺少的一些关键数据属性。我基本上只需要在我的form-groups中添加一个data-name={{field.name}}，表单提交现在就可以工作了。