Comment créer un formulaire à partir d'un schéma JSON?
Comment créer un formulaire à partir de JSON Schema?
J'écris du code en JavaScript et jQuery. Avec cette partie modèle comme Form, je crée ceci avec haml et je l’ajoute dans un fichier js. Pour le backend, j'utilise python. J'utilise le framework Django.
J'ai donc obtenu des liens pour créer un formulaire à partir de JSON Schema.
Lien de référence: http://neyric.github.io/inputex/examples/json-schema.html
Dans mon formulaire: Eléments de saisie: zones de texte, zone de texte, liste de sélection, boutons d'envoi et d'annulation présents.
Je souhaite donc demander si la création d'un formulaire avec un schéma JSON est possible ou non. Si oui, pouvez-vous fournir de bons liens?
jsonform - Créez des formulaires à partir du schéma JSON. Facilement modélisable. Compatible avec Twitter Bootstrap hors de la boîte.
Je cherchais la même chose et il s'avère qu'il y a de bonnes options. Voici les meilleures bibliothèques que j'ai pu trouver sur GitHub:
JSON Editor (JS simple) ( démo )
Angular Schema Form (AngularJS) ( démo )
Réagir sous forme JSONSchema (Réagir) ( démo )
Vous recherchez des formes en alpaga. http://www.alpacajs.org
Formulaires gérés par schéma JSON utilisant jQuery avec des moteurs de mise en page pour Bootstrap, jQuery UI/Mobile C'est très extensible et joli paré.
Apache 2.0 sous licence et communauté géniale (je suis un committer de code).
Je suis juste tombé sur cette question et je voulais ajouter cette nouvelle option:
JSONForms étend l'approche de modèle de vue AngularJS en éliminant la nécessité d'écrire des modèles HTML afin de créer des formulaires en exploitant les fonctionnalités de JSON et du schéma JSON.
La génération de formulaires à partir de JSON Schema est une pratique courante, spécialement pour les interfaces utilisateur générées automatiquement.
Dans votre cas, si vous souhaitez uniquement créer UN formulaire, il sera peut-être préférable de le coder directement.
Voici une bibliothèque que j'ai créée et qui, espérons-le, vous intéressera:
Générateur de formulaire JSON de schéma en HTML, prenant en charge les sous-schémas dynamiques (résolution à la volée). Bibliothèque extensible et personnalisable avec aucune dépendance. Extensions Bootstrap fournies
Démo en direct sur http://brutusin.org/json-forms
Regardez cette démo de ngx-schema-form :
http://guillotina.io/ngx-schema-form/dist/ngx-schema-form/json
- Prend un fichier de schéma JSON
- Génère cela dans un formulaire de page Web éditable entièrement fonctionnel
- Enregistre les modifications apportées au modèle JSON en tant qu'objet Javascript
- Permet d'ajouter du code de validation personnalisé pour n'importe quelle section
Cela fonctionne vraiment bien pour moi (je ne l'ai trouvé que quelques jours auparavant). Je l'utilise avec le dernier angulaire, et il fonctionne exactement comme indiqué. La source des exemples est ici:
https://github.com/guillotinaweb/ngx-schema-form/tree/master/src/app/json-schema-example
Ou ... vous pouvez jeter un oeil à surperformer . C’est une petite bibliothèque de générateur de formulaire javascript que j’ai récemment écrite pour soutenir mes propres projets, car j’en avais marre de constater que tous les générateurs de formulaire que j’examinais avaient une tonne de dépendances ou étaient nettement plus grands que ma page Web application.
Je veux dire, regardons les choses en face: si mon SPA a environ 20 Ko, mais non compressé, alors les routines de bibliothèque ne font que simplifier la création d’un formulaire. Ses principales caractéristiques seraient:
- Zéro dépendance.
- Remplissage moins important (non miné mais compressé: <2 Ko).
- Prise en charge native de la validation HTML5/du navigateur pour tous les types de saisie HTML5 +.
- Validation personnalisée sans faille intégrée.
- Prend en charge tous les frameworks Web (y compris Bootstrap).
- Remplit automatiquement les formulaires à moitié remplis lors du rechargement d'une page dans tous les navigateurs.
- JSON set/get pour toutes les valeurs de formulaire.
Regardez ce projet https://github.com/mirshahreza/json-edit
Un plugin jquery pour transformer le schéma json en formulaire Cela peut être utile dans votre scénario.
Une autre option est " json-schema-js-gui-model ". Il convertit le schéma json en un modèle graphique que vous pouvez facilement utiliser dans n’importe quel framework Web pour créer un formulaire personnalisé. Pour des conseils détaillés sur la dernière étape, le angular 2 docs propose une recette pour créer une forme dynamique à partir d’un modèle gui.