us on GitHub

Generate forms from a JSON schema, with AngularJS!

What is it?

Schema Form is a set of AngularJS directives (and a couple of services) to generate Bootstrap 3 ready forms from a JSON Schema.

JSON Schema

{
  "type": "object",
  "title": "Comment",
  "properties": {
    "name":  {
      "title": "Name",
      "type": "string"
    },
    "email":  {
      "title": "Email",
      "type": "string",
      "pattern": "^\\S+@\\S+$",
      "description": "Email will be used for evil."
    },
    "comment": {
      "title": "Comment",
      "type": "string",
      "maxLength": 20,
      "validationMessage": "Don't be greedy!"
    }
  },
  "required": ["name","email","comment"]
}
        

Form definition

[
  "name",
  "email",
  {
    "key": "comment",
    "type": "textarea",
    "placeholder": "Make a comment"
  },
  {
    "type": "submit",
    "title": "OK"
  }
]
          

Model

{{obj.model | prettyjson}}

Output/Demo

Check out
the demo
page for more
examples

Features

Get It

Use bower:

bower install angular-schema-form

Use npm:

npm install angular-schema-form

Or just download from github!

RTFM
FTW

The movie

Add-ons

Schema Form was built to be extended and its easy to create your own form field types that suit your specific requirement. Check out the docs on extending schema form for more details.

Third Party Add-ons ({{::addons.length}})