Search code examples
meteorbootstrap-datepickermeteor-autoform

Meteor bootstrap datetimepicker throwing errors and positioned incorrectly

I'm getting the following errors and positioning in the screen shot below when I use the autoform bootstrap datepicker.

enter image description here

Error:

2meteor.js:887 Exception from Tracker afterFlush function: undefined is not a function TypeError: undefined is not a function at null. (http://localhost:3000/packages/aldeed_autoform-bs-datetimepicker.js?279246d1cf7d4b5603ac030d7466e9bc6e5ac0d1:171:11)

Here is the code I have:

Packages:

aldeed:autoform                     # Auto create forms with validations from schema (Uses bootstrap by default).
twbs:bootstrap                      # Bootstrap.
tsega:bootstrap3-datetimepicker     # Bootstrap datetime picker.
aldeed:autoform-bs-datetimepicker   # Add datetime picker to autoform.

Schema:

   start:
      type: Date
      label: 'Start'
      autoform:
         type: 'bootstrap-datetimepicker'
   end:
      type: Date
      label: 'End'
      autoform:
         type: 'bootstrap-datetimepicker'

Form:

   +autoForm(collection='Events' id='insertEventForm' type='insert')
      fieldset
         legend Add an event
         +afQuickField(name='start')
         +afQuickField(name='end')
         +afQuickField(name='assignedToId')
      button.btn.btn-primary(type='submit') Submit

If anyone could tell me what I'm missing I would greatly appreciate it.

Solution

  • You need a container div around of the controls

    <body>
   <div class="container">
      <div class="row">
          <div class="col-md-6">
              your code snippet here
          </div>
      </div>
   </div>
</body>