Question

我正在尝试在灯箱模式中提交表单。但弹出显示空内容。我的代码如下：

<amp-lightbox id="success-lightbox" layout="nodisplay">
    <amp-list src="http://localhost:4000" width="auto" height="200" layout="fixed-height" items="." single-item>
        <template type="amp-mustache">
            <div class="lightbox-modal">
                <form action="/" method="get" target="_top">
                    {{#items}}
                    <input type="checkbox" value={{id}} /> {{/items}}
                    <input type="submit" value="submit" />
                </form>
            </div>
        </template>
    </amp-list>
</amp-lightbox>
<input class="" type="submit" value="show more" on="tap:success-lightbox" />

我包含了所有必需的依赖项amp-form，amp-lightbox，amp-list，amp-mustache。如果我删除表单标记，则复选框显示正常。

工作代码：

<amp-lightbox id="success-lightbox" layout="nodisplay">
    <amp-list src="http://localhost:4000" width="auto" height="200" layout="fixed-height" items="." single-item>
        <template type="amp-mustache">
            <div class="lightbox-modal">
                {{#items}}
                <input type="checkbox" value={{id}} /> {{/items}}
                <input type="submit" value="submit" />
            </div>
        </template>
    </amp-list>
</amp-lightbox>
<input class="" type="submit" value="show more" on="tap:success-lightbox" />

我浏览了文档。但没有找到任何东西。是不是可以将表格嵌入amp-lightbox？如果不可能，是否有任何解决方法从灯箱提交数据??

Answer 1

amp-mustache不支持表单元素。在您的情况下，一个简单的解决方法是将表单标记移动到amp-list元素之外。

在amp-lightbox内创建放大器形式

1 个答案: