Backbone Autocomplete view made with browserified projects in mind
Backbone Autocomplete view made with browserify style projects in mind.
It's a very straight up nested view with a filtered collection.
The view exposes a simple API. It's instanciated with a pre-existing collection, and when subclassing you are able to override some of its internal methods for your own logic.
The view takes standard parameters,
collection etc, and also an option
minimumInputLength if you want to restrict searching until the input length is above a certain value. It defaults to zero (this might not be so great).
By default, the view uses a field called 'name' from the models in the collection for searching. If you want to set your own, you can pass it as
searchField when instantiating.
Callback fired by the view when a user selects something by clicking on it, or by pressing enter after using the arrow keys
Method bound to the view instance, which is passed to
this.collection.filter(..) as the method to determine if the model from the parent collection should be included in the results. The current value of the user input box is available on
this.searchValue. Example below.
var AutocompleteView = require'backbone-autocomplete';// example in browserified codevar someNames =person: 'Bob'person: 'Barry'person: 'Alfred'person: 'James'person: 'Sylvia'person: 'Maureen'person: 'Alice'var MyAutocomplete = AutocompleteViewextendconsole.logmodel;// method passed to filter(..) on the collectionvar label = modelgetthissearchFieldtoLowerCase;// the method is bound to the view, with current value of the user input available as `this.searchValue`var searchValue = thissearchValuetoLowerCasetrim;if labelindexOfsearchValue !== -1return true;elsereturn false;;var nameCompletion =searchField: 'person' // setting the field to use as a searchcollection: someNames;nameCompletionrender;documentbodyappendChildnameCompletionel;
MIT Licence (c) Dan Peddle 2014