Question

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

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

名字
姓氏

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

谢谢您的建议。

Answer 1

在文档中加载必要的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">
```

调用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
}});

Answer 2

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

从每周下载的角度来看，这似乎是一个不错的回购协议，并且似乎非常适合您的用例（我可以自己尝试）。唯一的问题是，要了解React和nodejs的世界，还有一个学习曲线。如果您还没有的话，我会极力推荐。一些很好的入门资源包括：

从那里可以深入了解，但我觉得很有趣。祝你好运！

JSON数据中的验证HTML表单

2 个答案: