sergeyt / meteor-typeahead

Autocomplete package for meteor powered by twitter typeahead.js
https://atmospherejs.com/sergeyt/typeahead
MIT License
146 stars 82 forks source link

Missing last character when trying to get query value in "empty" template #114

Open andregoldstein opened 9 years ago

andregoldstein commented 9 years ago

I'm struggling with this one a little. I've been trying to output a message such as:

"Breaking Bad" couldn't be found in your collection.

in the designated "empty" template that I'm setting in data-templates

To do this I'm targeting the value of the input using jQuery and passing it off to a Session variable that I then call as a helper in my empty template. The call works except the query is always missing the final character. Strangely if I inspect the Session variable in my console, the full query is there.

Is there any reason why this shouldn't work with Typeahead?

Form template

<template name="bookSearchForm">

  <form action="/books/search" class="search searchBooks" method="post">
    <button class="searchBooksButton"><i class="fa fa-search"></i></button>
    <input id="searchBooksQuery" class="form-control typeahead" type="text"
       placeholder="Search for books in your collection or to add a new one"
       autocomplete="off" spellcheck="off"
       data-source="books" data-select="selected" data-templates="searchItem;empty:searchNoItems" />
  </form>

</template>

Empty template

<template name="searchNoItems">
  <div class="search-no-results">
    <span class="lookupBook">{{ bookSearchValue }} not in your collection, hit enter to search for it.</span>
  </div> <!-- /.search-no-results -->
</template>

JS

Template.bookSearchForm.events

  'keyup #searchBooksQuery': (e) ->
    bookVal = e.target.value 
    Session.set 'bookSearchValue', bookVal
Template.searchNoItems.helpers
  bookSearchValue: ->
    return Session.get 'bookSearchValue'