forms - 表单更改最佳实践

Question

在我的模板中，我有一个国家选择框，以及根据国家动态变化的省元素。例如，如果我选择美国，省将是一个选择框，其中包括美国各州。如果我选择其他国家，省将只是一个文本字段。我知道我必须通过 Javascript 来做到这一点，但我想知道在这种情况下的最佳实践。有什么建议吗？

Answer 1

这个问题几乎每天都会出现在stackoverflow上......如何处理像国家->国家这样的子选择......？

多个相关选择字段类型的最佳实践是仅从数据库中加载第一个选择框，并使用专用的提交按钮添加子选择 - 在您的情况下可能是“显示状态”或类似的。

第一次呈现表单时不要获取所有可能的子选择。如果您显示国家 -> 州 -> 城市之类的内容，这很容易导致大量的数据库查询......但是所有国家/地区的国家 -> 州已经太多了。

如果表单是使用“显示状态”按钮提交的，则将相关的子选择与“显示城市”按钮一起添加到表单中，或者如果没有其他子选择将被加载......使用最终的“保存”按钮。

这样，没有 JavaScript 的用户可以使用双重选择，而无需涉及最初不需要的子选择查询。仅使用 JS 隐藏第二个选择并不是最佳实践。

然后，通过 JavaScript 进行的渐进增强将是AJAX -加载即一个国家/地区的JSON列表，删除“显示状态”按钮，使用JS 模板引擎（如把手或小胡子）呈现数据并添加“保存”按钮。

这样您就不必向客户端浏览器发送太多重复数据（ option,option,option ... ）。

最后一步是缓存客户端和服务器端以加快加载时间——甚至可能涉及某种后台预加载，即客户端首选语言的前 5 种选择。