html不同表单带数据,复杂的HTML表单

这个问题并不长,因为我很难解释事情,主持人在减少这个问题的长度或改进它的标题(同时保持其含义)方面的任何帮助都将受到赞赏.

我正在设计一个可以处理复杂表单的通用应用程序,但要做到这一点,我需要决定如何自己处理表单……所以让我们暂时忘掉服务器后端.

我已经对此进行了一段时间的研究,但似乎找不到任何不过时或无关的东西.

我最简单的解释方法就是举个例子,让我们假设一个“商人”与“客户数据库”示例：

一名自雇商人决定为他的每个客户保留一份记录,他可以在那里存储他们的姓名,电话号码,电子邮件,国家,城市和出生日期.

为此,他使用了一个网络应用程序,他可以在他的手机上或在家里的旧办公室电脑上打开.

但遗憾的是,这位商人也是偏执狂,并关掉了他电脑上的所有JavaScript.

商人可能会指派他的秘书添加客户数据,所以让我们打电话给谁编辑“用户”表格.

这种形式的困难方面是支持多个电话和电子邮件,而国家>没有JavaScript的城市选择.

有几种解决方案,最简单的方法是首先存储客户端,然后在他实际存在之后向他提供所有电话号码,电子邮件和国家/地区,但在这种情况下,客户需要选择他/她的国家/地区.存储时至少有一个电话号码.

选择国家和城市可以通过一个表格带有“选择国家”字段和一个没有任何值的禁用“选择城市”和一个显示“选择国家”或类似的东西的按钮来完成…它将使用很少使用的表格按钮,类似于这样的东西：

General info

...name, surname, gender, age selection...

Country and city

Select country:

United Kingdom

United States

France

Germany

Spain

Italy

Canada

Select city: No city selected (you must first select a country)

用户单击“选择国家/地区”按钮,表单将根据其选择的国家/地区显示其输入的所有数据和“城市”选择字段

(只要表单验证了它输出的数据,并使用表单的唯一标记,它应该是安全的)

它还会显示国家选择字段为禁用,其所选国家/地区为选定值,并显示一个按钮以清除其选择,我们这样做是为了防止用户选择国家/地区,例如“美国”,然后是“城市”纽约“,后来改变了他在国内的选择,并阻止他提交一个价值为country =”Uruguay“和city =”New York“的表格.

另一种方法是仅显示一个名为“选择国家/城市”的按钮,当点击该按钮导致国家选择表格时,这反过来导致城市选择表格,当提交时将用户返回到他开始的表格.但我认为这个解决方案之上的解决方案更好.

如果有更好的方法,请纠正我.

然后在选择国家和城市之后,表单的用户必须将至少一个电话号码添加到尚未存储的“客户端”.

(电子邮件将以相同的方式处理)

这部分,我没有设法做,并希望得到一些帮助.

到目前为止,我所拥有的只是：

...name, surname, gender, age selection...

...country/city selection...

单击“添加电话号码”将导致用户可以输入电话号码的不同页面,然后将其添加到输入字段列表中：

...name, surname, gender, age selection...

...country/city selection...

List of phones that will be added when the client is saved:

• 987654321
• 987654322

我很确定有更好的方法,我上面做错了,我需要一些帮助.

如果可以通过多种方式理解答案,请提供示例HTML.

附：它不一定是“客户数据库”形式,只是它应该支持链式选择并为单个条目添加多个变量“值”(在本例中为电话和电子邮件).

编辑：

现在我想到了,手机应该是可编辑的,所以它应该是这样的：

...name, surname, gender, age selection...

...country/city selection...

List of phones that will be added when the client is saved:

“添加电话”会导致包含所有相同字段的表单,但它们将被隐藏并预填充用户值,以及用于添加新电话的字段.

或者我可以完全跳过它,只显示相同的页面,但添加了一个空的电话号码……或者编辑不同页面上的所有字段？

如果您使用此表单添加和编辑,也会出现问题.