Как я могу обработать форму с помощью form.io, используя vanilla JS?

Я играю с демонстрацией form.io на CodePen, но она использует Angular. Предполагая, что у меня есть базовая форма JSON и HTML-страница, не привязанная к какой-либо платформе, каков самый простой способ ее визуализации, инициализация формы с необязательной моделью и сбор модели после ее отправки?

Есть ли библиотека JavaScript form.io, которая делает это?

Пример сниппета JSON формы form.io:

{
  components: [
  {
    input: true,
    tableView: true,
    inputType: "text",
    inputMask: "",
    label: "First Name",
    key: "firstName",

1 ответ

Разработчики formio предоставляют formio.js для этого конкретного случая использования. Вот ссылка

Согласно их собственной документации: в вашем индексе:

<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="./node_modules/formiojs/dist/formio.form.min.css" />
<script src="node_modules/formiojs/dist/formio.form.min.js"></script>
<div id="formID" class="demo-box">Loading...</div>

тогда в вашем js:

let schema = {
  components: [
  {
    input: true,
    tableView: true,
    inputType: "text",
    inputMask: "",
    label: "First Name",
    key: "firstName"
  }]
}
let data = {}
let formio = new Formio.createForm(document.getElementById('formID'), schema, data)

я рекомендую использовать этот сайт для создания вашей схемы: https://formio.github.io/formio.js/app/sandbox

Другие вопросы по тегам