Gratis open source jQuery Form Builder

Alpaca Forms Gratis vormbouwer

Open source jQuery Form Builder voor interactieve HTML5 -vormen

Alpaca Forms is een open-source jQuery Form Builder, voor interactieve HTML5-formulieren voor uw web- en mobiele applicaties met behulp van JSON-schema en stuursjablonen.

Gratis open source jQuery Form Builder

Alpaca Forms

GitHub

Overzicht

Er zijn veel gratis HTML5 -formuliergeneratorhulpmiddelen beschikbaar. Maar Alpaca Forms is een zeer eenvoudige en eenvoudig te gebruiken JQuery Form Builder om HTML5-formulieren te genereren voor web- en mobiele applicaties. Hiermee kunt u geweldige gebruikersinterfaces genereren bovenop Twitter Bootstrap, JQuery UI, JQuery Mobile en HTML5 met behulp van JSON-schema en eenvoudige stuursjablonen. Alpaca is een zeer nuttige jQuery -vormontwerper en alles wat u nodig heeft, wordt out of the box verstrekt. Het wordt voorverpakt met een grote bibliotheek met bedieningselementen, sjablonen, lay-outs en functies. Alpaca is een JSON-aangedreven JavaScript-vorm-maker die het heel gemakkelijk maakt om prachtige vormen te maken. Het is zeer uitbreidbaar en ontworpen rond een uitbreidbaar objectgeoriënteerd patroon. Met deze ingebouwde uitbreidbaarheid kunt u nieuwe bedieningselementen, sjablonen, i18-bundels en aangepaste data-persistentie voor uw projecten uitbreiden en implementeren. Alpaca Forms biedt uitgebreide documentatie die bouwers en ontwikkelaars vormen naar het werken met veldbesturingselementen, lay -outs, sjablonen, callbacks en andere uitbreidbaarheidspunten binnen ALPACA.

Functies

Hierna volgen de belangrijkste kenmerken van Alpaca -formulieren

  • JSON-aangedreven
  • Ondersteunt JQuery UI, JQuery Mobile en HTML5 voor de rendered output
  • Stuursjablonen
  • uitbreidbaarheid
  • Een uitgebreide documentatie
  • Een groot aantal ondersteunde bedieningselementen
  • Ondersteun meerdere soorten gegevensbronnen
  • Ondersteuning voor callbacks
  • Ondersteund door Cloud CMS
  • Het is gratis en open source

Installatie instructies

Kopieer de volgende code naar het blok van uw webpagina:

    <!-- dependencies (jquery, handlebars and bootstrap) -->
      <script type="text/javascript" src="//code.jquery.com/jquery-1.11.1.min.js"></script>
      <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script>
      <link type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/>
      <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
      <!-- alpaca -->
      <link type="text/css" href="//cdn.jsdelivr.net/npm/alpaca@1.5.27/dist/alpaca/bootstrap/alpaca.min.css" rel="stylesheet"/>
      <script type="text/javascript" src="//cdn.jsdelivr.net/npm/alpaca@1.5.27/dist/alpaca/bootstrap/alpaca.min.js"></script>

Bel $ .alpaca () met uw formulierschema en elke configuratie:

     
    <div id="form1"></div>
    <script type="text/javascript">
    $("#form1").alpaca({
        "schema": {
            "title": "What do you think of Alpaca?",
            "type": "object",
            "properties": {
                "name": {
                    "type": "string",
                    "title": "Name"
                },
                "ranking": {
                    "type": "string",
                    "title": "Ranking",
                    "enum": ['excellent', 'not too shabby', 'alpaca built my hotrod']
                }
            }
        }
    });
    </script>

Dit genereert het volgende HTML5 -formulier met behulp van Twitter -bootstrap- en ALPACA -combinatie.

 Nederlands