可提交的HTML5 Web组件

时间:2016-06-03 19:39:37

标签: polymer-1.0 web-component

如何创建表单可提交的Web组件?

背景: 我有一个客户选择器组件,基本上是一个文本输入加上文本框右侧的一个小按钮加上一个单击按钮时弹出的对话框。它的使用方式与使用html选择的方式相同。

此组件用作以旧式(非ajax)方式提交的html表单的一部分。实际的html输入私有地封装在customer-picker组件中。

问题: 文本输入的值未提交

我想我能理解为什么会这样。我想这是期望的行为(否则我们打破了封装)。

所有这些都说明了,如何创建可提交的Web组件?

例如,假设我有一个这样的表单:

<form action="action.jsp">
    <input name="date-start"/>
    <input name="date-end"/>
    <input name="name-first"/>
    <input name="name-last"/>
</form>

像这样提交:

action.jsp?date-start=2016-06-01&date-end=2016-06-30&name-first=Joe&name-last=Smith

我想使用这样的组件创建相同的表单:

<form action="action.jsp">
    <date-range name="date">
    <full-name name="name">
</form>

提交的方式与上面的示例完全相同:

action.jsp?date-start=2016-06-01&date-end=2016-06-30&name-first=Joe&name-last=Smith

我知道铁形式。但是这个解决方案有一些问题。

首先,它不能很好地模拟本机表单提交。在正常的html表单中,当您提交时,当前页面将自动替换为操作URL返回的任何内容。这似乎不会发生在铁形式上。

二。它只允许您的组件为提交的数据提供单个值。在上面提到的日期范围示例中,我希望为一个组件提交两个值。

0 个答案:

没有答案