Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

15 Commits

Repository files navigation

form

Dynamically generate a form by adding fields from a schema.

Installation

$ component install segmentio/form

Example

varForm=require('form');varform=newForm();form.field({type: 'text',name: 'name',label: 'Enter your name...'});form.field({type: 'password',name: 'password',label: 'Choose a password...',legend: 'Must be at least 8 characters.'});form.field({type: 'submit',name: 'submit',label: 'Sign Up'});document.body.appendChild(form.el);

And you can add your own field types like so:

varForm=require('form');varColorField=require('color-field');Form.field('color',ColorField);varform=newForm();form.field({type: 'color',name: 'favorite',default: '#FFFFFF',label: 'Whats your favorite color?',});

API

Form(model, el)

Create a new form view with an optional model of settings (keyed by the fields's names) and el.

.fields

A dictionary of all the currently defined field types.

.field(type, Constructor)

Add a new field type with the given Constructor. Fields should follow the field spec, having value, name, invalid and valid methods.

#el

The form's DOM element.

<formclass="form"><!-- Your fields get appended here, like: --><fieldsetclass="form-field">
...
</fieldset></form>

#field(schema)

Add a new field to the form with the given schema. Fields are keyed by their type property in the Form.fields dictionary.

{
name : 'String'
type : 'String' (optional)
label : 'String' (optional)
legend : 'String' (optional)
default : 'Mixed' (optional)
}

You can also pass any other properties in the schema and handle them however you want with your custom field types. For example, a "range" field would probably take a min and max.

#prevent()

Prevent the form from submitting normally.

#toJSON()

Returns a JSON object of the form's field values.

#Classes

ianstormtaylor/classes is mixed in.

Field Types

"default"

The default field, just a simple text input. If you don't specify a type property in your field schema, it'll use the default field.

"submit"

A generic submit field. The label will be used as the button's text.

License

MIT

About

Dynamically generate a form by adding fields from a schema.

Resources

Stars

11 stars

Watchers

37 watching

Forks

Releases

Packages

Contributors

Languages