angular-schema-form-panel v1.0.0

Angular Schema Form Bootstrap Panel Decorator v1.0.0

Adds support for Bootstrap's custom panel component in Angular Schema Form

View the Live Demo on CodePen for examples.

Installation

Install angular-schema-form-panel via npm or bower.

NPM

npm install angular-schema-form-panel

Bower

bower install angular-schema-form-panel

Usage

Include angular-schema-form-panel.min.js (or the un-minified angular-schema-form-panel.js) file in your HTML document(s):

<script src="node_modules/angular-schema-form-panel/dist/angular-schema-form-panel.min.js"></script>

Add schemaFormPanel as an Angular dependency in your application module:

var app = angular.module('myApp', [..., 'schemaForm', 'schemaFormPanel']);

Then use panel as the type in your form's JSON definition:

$scope.form = [
    ...,
    {
        type: "panel",
        items: [...],
        ...options
    }
]

You can also make an accordion of panels by using panel-group as the type (make sure the items of your panel-group are panel objects) in your form's JSON definition:

$scope.form = [
    ...,
    {
        type: "panel-group",
        items: [
            {
                type: "panel",
                items: [...],
                ...options
            },
            {
                type: "panel",
                items: [...],
                ...options
            },
            {
                type: "panel",
                items: [...],
                ...options
            }
        ]
    }
]

Options

You can use the following options on each panel object. All options are optional unless specified.