Searching with meteor autocomplete package (mizzao)

Question

I am new to Javascript and Meteor and having some trouble getting the Meteor autocomplete package from Mizzau to work correctly. I can get the form to autocomplete just fine, but having trouble getting it to filter my todos. The end result I am hoping for is to enter in a todo into the autocomplete and have it filter the subscription, I would also settle for search and going from there. I will also say my initial state is the list returns 0 todos (none are displayed) I feel like I may be close. A good part of my code came from this: Meteor - autocomplete with "distinct" feature? T Does it have something to do with my subscription?

Here is my server side publish call:

    Meteor.publish("todosAuto", function(selector, options) {
  Autocomplete.publishCursor(Todos.find(selector, options), this);
  this.ready();
});

My client side subscription:

Meteor.subscribe('todosAuto');

The relevant part of my template:

<div class="container todoFormSec">
    <div class="col-md-4">
      {{> inputAutocomplete settings=settings id="msg" class="form-control" placeholder="Search..."}}
    </div>
  <div class="row">
    <div class="col-md-5 pull-right">
      <h1 class="todocountstyle text-right">You Have {{ todoCount }} Todos</h1>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <div class="todos">
          {{ #each todosAuto }}
              {{ >todo }}
          {{ /each }}
      </div>
      </div>
  </div>
</div>

And my settings:

Template.home.helpers({

  todos: function() {
  return Todos.find();
},


todoCount: function() {
  return Todos.find({userid: Meteor.userId()}).count();
},

  settings: function() {
    return {
      position: "top",
      limit: 5,
      rules: [
        {
          token: '@',
          collection: 'Todos',
          field: "title",
          subscription: 'todosAuto',
          template: Template.titlePill
        },
        {
          token: '#',
          collection: 'Todos',
          field: "categories",
          options: '',
          subscription: 'todosAuto',
          matchAll: true,
          template: Template.dataPiece
        }
      ]
    };
  }

});

Template.home.events({ // listen for selection and subscribe
  "autocompleteselect input": function(event, template, doc) {

   Meteor.subscribe("todosAuto", doc.title);
  }
});

Answer 1

In the past I tried to use this autocomplete package you are having trouble with. I found it just wasn't high fidelity enough for my needs. Therefore I recommend Twitter typeahead and bloodhound to you. I am very happy with the following packages ajduke:bootstrap-tokenfield in combination with sergeyt:typeahead

The time investment is well worth it. See my previous posting for examples. Here are more examples.

If the above is too complicated, try jeremy:selectize . Point is that there are plenty of better packages out there.