JSON数据中的验证html表单答案

【问题标题】：Validation html form within JSON dataJSON数据中的验证html表单
【发布时间】：2019-03-04 12:44:26
【问题描述】：

是否有任何库或 JavaScript 可以使用 JSON 数据创建带有验证的表单？

例如，如果我有类似 {firstname: Jhon, lastname: Doe, age:32} 的 JSON，并且我在带有字段的外部系统上有一个 HTML 输入表单：

名字
姓

当访问者在表单上输入他们的姓名时，后端将检查 JSON 数据的验证。

感谢您的任何建议。

【问题讨论】：

您可以使用 Joi 来验证您的对象。请看这里：github.com/hapijs/joi
感谢您的建议将检查此

标签： javascript json validation

【解决方案1】：

使用 React 和 node.js 可能是未来更安全的解决方案，因为它已成为行业标准......你看过：https://www.npmjs.com/package/react-jsonschema-form 吗？

从每周下载的角度来看，它看起来像是一个非常可靠的存储库，并且似乎很适合您的用例（我可以自己尝试一下）。唯一的问题是要跟上 React 和 nodejs 的世界有一条学习曲线。如果你还没有的话，我强烈推荐它。一些很好的入门资源包括：

从那里它可以成为一个深入的潜水，但我觉得它很有趣。祝你好运！

【讨论】：

【解决方案2】：

在文档中加载必要的 jQuery 和 underscore.js 库。

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/underscore.min.js"></script>

加载 Bootstrap 的样式表以美化生成的表单字段。
```
<link rel="stylesheet"href="/path/to/bootstrap.css">
```
给表单一个类名
```
<form class="form">
```

在表单元素上调用函数并在 JSON 中定义表单字段

$('form').jsonForm({
"schema": {
"name": {
  "title": "your title",
  "description": "Your description",
  "type": "your type",
},
  "enum": [
    "male",
    "female",
    "alien"
  ]
}});

使用onSubmit 回调验证提交时的数据。

$('form').jsonForm({


onSubmit: function (errors, values) {
if (errors) {
  // do something
}
else {
  // do something
}});

【讨论】：