An add-on Meteor package for aldeed:autoform. Provides a single custom input type, "selectize", which renders an input using the selectize plugin.
The plugin library must be installed separately.
In a Meteor app directory, enter:
$ meteor add jeremy:selectize
$ meteor add aldeed:autoform
If using with bootstrap, you'll probably also want to:
$ meteor add chhib:selectize-bootstrap-3
(note: as replace of jeremy:selectize
)
In a Meteor app directory, enter:
$ meteor add comerc:autoform-selectize
Specify "selectize" for the type
attribute of any input. This can be done in a number of ways:
In the schema, which will then work with a quickForm
or afQuickFields
:
{
tags: {
type: [String],
autoform: {
type: "selectize",
afFieldInput: {
multiple: true,
options: []
}
}
}
}
Or on the afFieldInput
component or any component that passes along attributes to afFieldInput
:
{{> afQuickField name="tags" type="selectize" multiple=true}}
{{> afFormGroup name="tags" type="selectize" multiple=true}}
{{> afFieldInput name="tags" type="selectize" multiple=true}}
To provide selectize options, set an options
attribute equal to a helper that returns a list of options. Each option should have a label
field and a value
field. See example below:
Template.myFormWithSelectize.helpers({
selectizeOptions: function () {
return [
{value: '1', label: 'option 1'},
{value: '2', label: 'option 2'}
]
}
});
<template name="myFormWithSelectize">
{{#autoForm collection=myCollection id="my-form-id" type="insert"}}
{{> afQuickField name="tags" options=selectizeOptions}}
<button type="submit" class="btn btn-primary">Insert</button>
{{/autoForm}}
</template>
Most of the data-
attributes that the plugin recognizes should also work.
Currently only select
element features are supported. UPD You can use selectize-input
now.
Anyone is welcome to contribute. Fork, make your changes, and then submit a pull request.