我开始使用 Polymer 并且找不到很多问题的答案。
我有两个输入
<paper-input id="startDate" type="date"
error-message="The end date is before the start date"></paper-input>
<paper-input id="endDate" type="date"></paper-input>
当两者都为空或只有一个填写时,表单有效。如果两者都已填充,则需要验证 endDate
是否大于或等于 startDate
。
怎么做?
最佳答案
如果您刚开始,请阅读开发人员指南,您可以在其中找到大部分问题的答案。
在您的情况下,您需要使用纸张输入的值声明属性并观察其变化。 https://www.polymer-project.org/1.0/docs/devguide/properties.html#change-callbacks .在该观察者中,您可以编写逻辑并将任何(或两个)字段设置为无效。
<dom-module id="my-form">
<template>
<paper-input id="startDate" type="date" value="{{startDate}}" error-message="The end date is before the start date"></paper-input>
<paper-input id="endDate" type="date" value="{{endDate}}"></paper-input>
</template>
<script>
(function() {
'use strict';
Polymer({
is: 'my-form',
properties: {
startDate: Date,
endDate: Date,
},
observers: ['_dateChange(startDate, endDate)'],
_dateChange: function(startDate, endDate) {
if(/*logic goes here*/) {
this.$.startDate.invalid = true;
} else {
this.$.startDate.invalid = false;
}
}
});
})();
</script>
</dom-module>
关于javascript - Polymer1.0 验证两个输入[type=date],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33259025/