diff --git a/.versions b/.versions index 40248aa..d50a0e9 100644 --- a/.versions +++ b/.versions @@ -1,5 +1,5 @@ aldeed:autoform@4.0.0 -aldeed:autoform-bs-datepicker@1.0.5 +aldeed:autoform-bs-datepicker@1.1.0 aldeed:simple-schema@1.1.0 base64@1.0.2 blaze@2.0.4 diff --git a/README.md b/README.md index 1482a89..d2fd89c 100644 --- a/README.md +++ b/README.md @@ -50,6 +50,8 @@ Or on the `afFieldInput` component or any component that passes along attributes {{> afFieldInput name="typeTest" type="bootstrap-datepicker"}} ``` +## Automatic Type Conversions + This input type is intended to be used with `type: Date` schema keys, but it also works with other schema types. Here's a list: * `Date`: Value is stored as a `Date` object representing midnight in the UTC timezone on the morning of the selected date. @@ -59,6 +61,31 @@ This input type is intended to be used with `type: Date` schema keys, but it als To provide bootstrap-datepicker options, set a `datePickerOptions` attribute equal to a helper that returns the options object. Most of the `data-date` attributes that the plugin recognizes should also work. +## Customizing Appearance + +To easily add an input group add-on after the field, just provide the classes for the span in a `buttonClasses` attribute: + +```js +{{> afFieldInput name="typeTest" type="bootstrap-datepicker" buttonClasses="glyphicon glyphicon-calendar"}} +``` + +If you want to customize the appearance of the input more, for example to use input group add-ons both before and after the field, use the [aldeed:template-extension](https://atmospherejs.com/aldeed/template-extension) package to replace the "afBootstrapDatepicker" template, like this: + +```html + +``` + +```js +Template.dpReplacement.replaces("afBootstrapDatepicker"); +``` + ## Demo [Live](http://autoform.meteor.com/types) diff --git a/autoform-bs-datepicker.html b/autoform-bs-datepicker.html index 9fc5696..7121b9b 100644 --- a/autoform-bs-datepicker.html +++ b/autoform-bs-datepicker.html @@ -3,8 +3,7 @@
- {{/if}} - {{#unless atts.buttonClasses}} + {{else}} - {{/unless}} + {{/if}} diff --git a/autoform-bs-datepicker.js b/autoform-bs-datepicker.js index c6296cd..e843236 100644 --- a/autoform-bs-datepicker.js +++ b/autoform-bs-datepicker.js @@ -1,4 +1,4 @@ -/* global AutoForm */ +/* global AutoForm, $ */ AutoForm.addInputType("bootstrap-datepicker", { template: "afBootstrapDatepicker", diff --git a/package.js b/package.js index 128dd1f..515ab84 100644 --- a/package.js +++ b/package.js @@ -1,7 +1,7 @@ Package.describe({ name: 'aldeed:autoform-bs-datepicker', summary: 'Custom bootstrap-datepicker input type for AutoForm', - version: '1.0.5', + version: '1.1.0', git: 'https://github.com/aldeed/meteor-autoform-bs-datepicker.git' });