聚合物 + 表单 POST 数据答案

【问题标题】：Polymer + form POST data聚合物 + 表单 POST 数据
【发布时间】：2014-08-19 03:10:54
【问题描述】：

我有这个

<form id="form_837299" class="appnitro"  method="post" action="insert.php"> <paper-input label="Title" name="title" maxlength="255">
            </paper-input>
          <paper-input floatinglabel multiline label="text" name="text"></paper-input>                           


          <li class="buttons">                                       

            <input type="hidden" name="form_id" value="837299" />                                                        
            <input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" />                           
          </li>                          
        </ul>                    
      </form>

我的 POST 数据有问题 - “文本”和“标题”没有发送任何内容（都在纸质输入中）。

我修改了模板，属性“name”现在位于 Polymer 创建的一个 div 中。但没有数据发送。

print_r($_POST);只给我看这个：数组（[form_id] => 837299 [提交] => 提交）

有人知道如何在表单上使用 Polymer 和 Material UI 吗？

【问题讨论】：

标签： forms polymer material-design

【解决方案1】：

只有扩展原生表单元素的元素会自动与表单一起提交。 paper-input 扩展 core-input 内部有一个输入，而不是扩展它。更多讨论请参见this mailing list discussion，可能的解决方案请参见this StackOverflow post。

可能是this jsbin 之类的东西？

更新：web component form 中的内容相同。

更新：看起来ajax-form的创建者有added这个功能。

更新：也可以考虑使用iron-form。

【讨论】：

在第一个链接中，我发现了为什么我有问题 - 文本和标题在 shadow-root 中，这不是在 POST 数据中发送。而且 jsbin 看起来不错！谢谢
太棒了！仅供参考，据报道，Polymer 团队正在开发一个 paper-form 元素，它可能会自动解决这个问题。
看起来paper-form 的开发已经停滞（自 8 月以来没有提交）。提交 Polymer 自定义表单字段的推荐方式仍然是ajax-form。免责声明：我是ajax-form的作者。
Polymer 的iron-form 涵盖了ajax-form 的大部分（如果不是全部）功能。此外，看起来 ajax-form 依赖于过时的 Polymer 版本。
“ajax-form 已过时。改用 iron-form”我不同意。 Iron-form 缺少很多 ajax-form 多年来所拥有的功能。另外，铁形式与聚合物有关。 ajax-form 没有依赖关系。

【解决方案2】：

根据 Polymer 文档，这样做的方法是创建一个常规表单输入并将其包装在 <paper-input-decorator>

https://www.polymer-project.org/docs/elements/paper-elements.html#paper-input

我试过了，效果很好。一些更好的形式支持会很酷，但是哦。这东西还是有点石头的。

更新：我已经构建了一个 bower 包 (polymer-rails-forms) 来处理聚合物中的表单，专门针对 ActiveRecord 输入命名方案量身定制，但它确实适用于任何旧表单。它仍然相对较新，但它涵盖了大多数输入类型、基本验证、xhr 和非 xhr 提交，并且还有一些很酷的附加功能，例如 image、json 和 location* 字段。

位置字段取决于 Google Map Places API

【讨论】：