Meteor JS Autoform自定义输入-没有当前视图

Question

I'm creating my own custom input type for autoform in meteor js. Everything works as it should, but I get a weird error in browser's console. This custom input is a bootstrap dropdown multi checkbox with possibility of being nested in other bootstrap dropdowns. Error occurs when you check any field inside dropdown.

Uncaught Error: There is no current view

Blaze._getCurrentView
Blaze.getView
AutoForm.templateInstanceForForm
_validateField
_.throttle.later

Here is my coffee file used for custom input.

AutoForm.addInputType "dropdownMultiCheckbox",
  template: "afDropdownMultiCheckbox"
  valueOut: () ->
    grabInput = $(@).children().children('input:checked')
    holder = []
    grabInput.each ->
      holder.push $(@).val()
    if $(grabInput[0]).hasClass('all-selector')
      holder.shift()
    holder

SimpleSchema.messages
  'atLeastOne': 'You need to select at least one field'

Template.afDropdownMultiCheckbox.helpers

  options: ->
    options = @.selectOptions
    options

  dsk: () ->
    @.atts["data-schema-key"]

Template.afDropdownMultiCheckbox.events
  'click div.dropdown-toggle': (event) ->
    $(event.target).siblings("ul.dropdown-menu").toggle()
  'click .all-selector': (event) ->
    if event.target.checked
      $(event.target).parent().siblings().children(".checkbox-options").prop('checked',true)
    else
      $(event.target).parent().siblings().children(".checkbox-options").prop('checked',false)
  'click .checkbox-options': (event,templateInstance) ->
    if !(event.target.checked)
      $(event.target).parent().siblings().children(".all-selector").prop('checked',false)
    if $(".check-onclick-#{@.class}:checked").length == $(".check-onclick-#{@.class}").length
      $("#checkbox-all-#{templateInstance.data.atts.id}").prop('checked',true)
  'click div.btn.btn-default.dropdown-toggle,ul,ul *': (event) ->
    event.stopPropagation()

Template.afDropdownMultiCheckbox.rendered = ->
  instanceOfTemplate = @
  $("*").on "click", (event) ->
    if !($(event.target)[0] == $(".class-#{instanceOfTemplate.data.atts.id}")[0] ||
       $(event.target)[0] == $("##{instanceOfTemplate.data.atts.id}")[0] ||
       $(event.target).hasClass("close-dropdown-multi"))
      $(".class-#{instanceOfTemplate.data.atts.id}").hide()

jade file below:

template(name="afDropdownMultiCheckbox")
  .dropdown
    .btn.btn-default.dropdown-toggle(type="button", id="{{atts.id}}", aria-expanded="false")
      | {{atts.buttonText}}
      span.caret
    ul.dropdown-menu(role="menu", aria-labelledby="{{atts.id}}",class="class-{{atts.id}}")
      form
        div(data-schema-key="{{dsk}}")
          if atts.allOption.presence
            li.close-dropdown-multi(role="presentation")
              input.all-selector.close-dropdown-multi(type="checkbox", value="{{atts.allOption.value}}", id="checkbox-all-{{atts.id}}", role="menuItem")
              label.close-dropdown-multi(for="checkbox-all-{{atts.id}}") {{atts.allOption.value}}
          +each options
            li.close-dropdown-multi(role="presentation")
              input.close-dropdown-multi.checkbox-options(class="check-onclick-#{this.class}", role="menuItem", type="checkbox", value="#{this.text}", id="checkbox-#{this.text}")
              label.close-dropdown-multi(for="checkbox-#{this.text}") {{this.text}}
        br

Schema file I use:

  categories:
    type: [String]
    optional: false
    custom: ->
      if this.value.length == 0
        'atLeastOne'
    autoform:
      buttonText: 'Categories'
      label: false
      id: 'dropdown-nr-1'
      options: -> _.map CampaignCategories, (arg1) ->
        option =
          text: t "campaign.categories.#{arg1}"
          class: 'dropdown-vol-1'
      allOption:
        presence: false
        value: 'All'
      afFieldInput:
        type: 'dropdownMultiCheckbox'

  locations:
    type: [String]
    optional: false
    custom: ->
      if this.length == 0
        'atLeastOne'
    autoform:
      buttonText: 'Locations'
      label: false
      id: 'dropdown-nr-2'
      allOption:
        presence: true
        value: 'All'
      options: -> _.map CampaignLocations, (arg1) ->
        option =
          text: t "campaign.locations.#{arg1}"
          class: 'dropdown-vol-2'
      afFieldInput:
        type: 'dropdownMultiCheckbox'

EDITED:

Error is caused by CampaignLocations array in schema which is used for i18n in meteor app. It's global variable, maybe someway it's changing meteor context (and this value) because it loads variable outside current template. If I return static value like this below:

[{text: 'test',class: 'test'},{text: 'test',class: 'test'},{text: 'test',class: 'test'}]

Everything is ok and there is no error.

Answer 1

I solved the problem. The problem was very simple but "thanks" to the way that javascript (and meteor) shows errors I didn't notice that I tried to nest form inside form, this is why "Uncaught Error: There is no current view" occured.

What caught me completely off guard was the moment when error appeared in my chrome console. Meteor will not complain with errors when using autoform and nesting form tag inside form tag when "options" property is generated with static data like this

[{text: 'test',class: 'test'},{text: 'test',class: 'test'},{text: 'test',class: 'test'}]

But if you will use for example this kind of code inside options property:

  options: -> _.map CampaignLocations, (arg1) ->
    option =
      text: t "campaign.locations.#{arg1}"
      class: 'dropdown-vol-2'

Which is using interpolation or string concatenation then Meteor will throw the error.