Polymer 提交html表单时需要纸张菜单/纸张下拉菜单

如何制作表单提交所需的纸质菜单元素？我有一个自定义元素，其中包含几个聚合物元素。常规纸张输入为空时会阻止表单提交，但纸张菜单不会

编辑： 我想是纸张下拉菜单需要具有必需的属性，而不是纸张菜单。所需的行为类似于html表单中所需的Select标记的正常行为

<link rel="import" href="../../bower_components/polymer/polymer.html">

<dom-module id="rsvp-form">
  <template>
    <style include="shared-styles"></style>
    <style>
      :host {
        display: block;
      }
    </style>
    <form is="ajax-form" id="rsvp" method='post' action='/api/rsvps'>
      <h2 class="page-title">RSVP</h2>
      <div class='layout horizontal wrap'>
        <paper-input label='First Name' class='flex' value='{{firstName}}' name="firstName" required></paper-input>
        <paper-input label='Last Name' class='flex' value='{{lastName}}' name="lastName" required></paper-input>
      </div>
      <div class='layout horizontal flex'>
        <paper-dropdown-menu label="Attendance" class='flex' name="attendance" required>
          <paper-menu class="dropdown-content" selected='{{selectedIndex}}' required>
            <paper-item>I would love to attend!</paper-item>
            <paper-item>I cannot attend.</paper-item>
          </paper-menu>
        </paper-dropdown-menu>
      </div>
      <paper-button id="submitButton" on-tap='submitRsvp' raised>Submit</paper-button>
    </form>
  </template>

  <script>
    (function() {
      'use strict';

      Polymer({
        is: 'rsvp-form',

        properties: {
          selectedIndex: {
            type: Number,
            observer: '_selectedIndexChanged'
          },
          firstName: {
            type: String,
            value: ''
          },
          lastName: {
            type: String,
            value: ''
          },
          attendance: {
            type: String,
            value: ''
          }
        },
        _selectedIndexChanged: function(newIndex) {
          if (newIndex === 0) {
            this.absent = false;
          } else if (newIndex === 1) {
            this.absent = true;
          }
          this.attending = !this.absent;
        },
        submitRsvp: function(e) {
          Polymer.dom(e).localTarget.parentElement.submit();
        }

      });

      document.addEventListener('WebComponentsReady', function() {
        var form = document.getElementById("rsvp");

        //modify existing or add new datapoints to be submitted here
        form.addEventListener('submitting', function(event) {

        });
      });

    })();
  </script>

</dom-module>

：主持人{
显示：块；
}
冒险类游戏
我很乐意参加！
我不能参加。
提交
（功能（）{
"严格使用",；
聚合物({
is:‘rsvp表格’，
特性：{
所选索引：{
类型：数字，
观察者：“\u selectedIndexChanged”
},
名字：{
类型：字符串，
值：“”
},
姓氏：{
类型：字符串，
值：“”
},
出席人数：{
类型：字符串，
值：“”
}
},
_selectedIndexChanged:函数（新建索引）{
如果（newIndex==0）{
这个。缺席=假；
}else if（newIndex==1）{
这是真的；
}
this.attenting=！this.缺席；
},
提交人SVP：功能（e）{
Polymer.dom（e）.localTarget.parentElement.submit（）；
}
});
document.addEventListener（'WebComponentsReady'，function（）{
var form=document.getElementById（“rsvp”）；
//修改要在此提交的现有数据点或添加新数据点
form.addEventListener（“提交”），函数（事件）{
});
});
})();

看起来您可能正在使用，这取决于聚合物的过时版本（1.0之前）与最新版本（1.5.0）不兼容。实际上，您应该切换到Polymer，它似乎提供了与ajax表单相同的功能

iron表单

应允许现有代码按预期工作（即，需要

纸张下拉菜单

选择）。与

ajax表单

的

提交

事件等价的是

iron表单

的事件

以下是您可以在

iron form

forms上收听的各种活动的演示：

冒险类游戏
我很乐意参加！
我不能参加。
提交
HTMLImports.whenReady（函数（）{
聚合物({
is:‘rsvp表格’，
特性：{
所选索引：{
类型：数字，
观察者：“\u selectedIndexChanged”
},
名字：{
类型：字符串，
值：“”
},
姓氏：{
类型：字符串，
值：“”
},
出席人数：{
类型：字符串，
值：“”
}
},
听众：{
“rsvp.iron表格预提交”：“U预提交”，
“提交rsvp.iron表格”：“提交”，
“rsvp.iron表单错误”：“U错误”，
'rsvp.iron form invalid'：'u invalid'，
},
_selectedIndexChanged:函数（新建索引）{
如果（newIndex==0）{
这个。缺席=假；
}else if（newIndex==1）{
这是真的；
}
this.attenting=！this.缺席；
},
提交人SVP：功能（e）{
这是$.rsvp.submit（）；
},
_预提交：函数（）{
//您可以在发送数据之前在此修改数据
log（'presubmit request'，this.$.rsvp.request）；
},
_提交：函数（）{
//数据已成功提交
log（'submittedrequest'，this.$.rsvp.request）；
},
_错误：函数（e）{
//数据未能提交
console.log（'submittedfailed'，this.$.rsvp.request，e.detail）；
},
_无效：函数（）{
//表单输入无效
console.log（'输入无效（未提交）'；
}
});
});

非常感谢大家提到ajax表单已经过时。当我试图将表单提交到工作中时，我看到的一切都表明ajax表单比iron表单好得多，所以这就是我所采用的，但这似乎不再是事实。没问题。：）你在哪里看到

ajax表单

比

iron表单

好？“更好”可能是言过其实了，但我也遇到了类似的问题[在提交过程中没有传递数据。而且Polymer博客似乎也有过ajax表单的特色[因此我认为这没问题]。