Meteor AutoForm Hint

Add hints to your quickForms, defined via SimpleSchema. Compatible with bootstrap3 and bootstrap4.

Installation

meteor add jkuester:autoform-hint

If you want to use bootstrap 4 add the following package:

meteor add imajus:autoform-bootstrap4

This will auto-override the rendering method of afFormGroup_bootstrap3 and afFormGroup_bootstrap4 template. The template will keep all it's original functionality. Works also with bootstrap4.

Usage

Define a hint on your schema:

1new SimpleSchema({
2  username: {
3    type: String,
4    autoform: {
5      hint: 'Enter a username. Allowed characters are....'
6    }
7  },
8  password: {
9    type: String,
10    autoform: {
11      hint: 'Enter a password. Allowed characters are....'
12    }
13  }
14})

Customization

Note, that the default position is on top next to the label. You can also define the position more precise using hintTop and hintBottom:

1new SimpleSchema({
2  username: {
3    type: String,
4    autoform: {
5      hintTop: 'Enter a username. Allowed characters are....'
6    }
7  },
8  password: {
9    type: String,
10    autoform: {
11      hintBottom: 'Enter a password. Allowed characters are....'
12    }
13  }
14})

You can also customize the position / style by defining the following css classes:

1.afhint-bottom-block {
2  /* style here */
3}
4
5.afhint-top-block {
6  /* style here */
7}

License

MIT, 2018 Jan Küster