diff options
| -rw-r--r-- | docs/javascript.html | 17 | ||||
| -rw-r--r-- | docs/templates/pages/javascript.mustache | 17 | ||||
| -rw-r--r-- | js/bootstrap-typeahead.js | 21 |
3 files changed, 44 insertions, 11 deletions
diff --git a/docs/javascript.html b/docs/javascript.html index d48924115..53130bd16 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -1353,7 +1353,7 @@ $('.myCarousel').carousel({ <tr> <th style="width: 100px;">Name</th> <th style="width: 50px;">type</th> - <th style="width: 50px;">default</th> + <th style="width: 90px;">default</th> <th>description</th> </tr> </thead> @@ -1370,6 +1370,18 @@ $('.myCarousel').carousel({ <td>8</td> <td>The max number of items to display in the dropdown.</td> </tr> + <tr> + <td>matcher</td> + <td>function</td> + <td>case sensitive</td> + <td>The method used to determine if a query matches an item. Accepts a single argument, the <code>item</code> against which to test the query. Access the current query with <code>this.query</code>. Return a boolean <code>true</code> if query is a match.</td> + </tr> + <tr> + <td>sorter</td> + <td>function</td> + <td>no sort</td> + <td>Method used to sort autocomplete results. Accepts a single argument <code>items</code> and has the scope of the typeahead instance. Reference the current query with <code>this.query</code>.</td> + </tr> </tbody> </table> @@ -1378,6 +1390,9 @@ $('.myCarousel').carousel({ <pre class="prettyprint linenums"> <input type="text" data-provide="typeahead"> </pre> + <h3>Methods</h3> + <h4>.typeahead(options)</h4> + <p>Initializes an input with a typahead.</p> </div> </div> </section> diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index 9113c1776..3c7a3b101 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -1288,7 +1288,7 @@ $('.myCarousel').carousel({ <tr> <th style="width: 100px;">{{_i}}Name{{/i}}</th> <th style="width: 50px;">{{_i}}type{{/i}}</th> - <th style="width: 50px;">{{_i}}default{{/i}}</th> + <th style="width: 90px;">{{_i}}default{{/i}}</th> <th>{{_i}}description{{/i}}</th> </tr> </thead> @@ -1305,6 +1305,18 @@ $('.myCarousel').carousel({ <td>8</td> <td>{{_i}}The max number of items to display in the dropdown.{{/i}}</td> </tr> + <tr> + <td>{{_i}}matcher{{/i}}</td> + <td>{{_i}}function{{/i}}</td> + <td>case sensitive</td> + <td>{{_i}}The method used to determine if a query matches an item. Accepts a single argument, the <code>item</code> against which to test the query. Access the current query with <code>this.query</code>. Return a boolean <code>true</code> if query is a match.{{/i}}</td> + </tr> + <tr> + <td>{{_i}}sorter{{/i}}</td> + <td>{{_i}}function{{/i}}</td> + <td>no sort</td> + <td>{{_i}}Method used to sort autocomplete results. Accepts a single argument <code>items</code> and has the scope of the typeahead instance. Reference the current query with <code>this.query</code>.{{/i}}</td> + </tr> </tbody> </table> @@ -1313,6 +1325,9 @@ $('.myCarousel').carousel({ <pre class="prettyprint linenums"> <input type="text" data-provide="typeahead"> </pre> + <h3>{{_i}}Methods{{/i}}</h3> + <h4>.typeahead({{_i}}options{{/i}})</h4> + <p>{{_i}}Initializes an input with a typahead.{{/i}}</p> </div> </div> </section>
\ No newline at end of file diff --git a/js/bootstrap-typeahead.js b/js/bootstrap-typeahead.js index b4d839c93..39331816e 100644 --- a/js/bootstrap-typeahead.js +++ b/js/bootstrap-typeahead.js @@ -24,6 +24,8 @@ var Typeahead = function ( element, options ) { this.$element = $(element) this.options = $.extend({}, $.fn.typeahead.defaults, options) + this.matcher = this.options.matcher + this.sorter = this.options.sorter this.$menu = $(this.options.menu).appendTo('body') this.source = this.options.source this.shown = false @@ -34,11 +36,6 @@ constructor: Typeahead - , matcher: function (item, query) { - // ;_; http://jsperf.com/asdfdfasdfa - return ~item.toLowerCase().indexOf(query) - } - , select: function () { var val = this.$menu.find('.active').attr('data-value') this.$element.val(val) @@ -77,12 +74,12 @@ return this.shown ? this.hide() : this } - q = this.query.toLowerCase() - - items = jQuery.grep(this.source, function (item) { - if (that.matcher(item, q)) return item + items = $.grep(this.source, function (item) { + if (that.matcher(item)) return item }) + items = this.sorter(items) + if (!items.length) { return this.shown ? this.hide() : this } @@ -233,6 +230,12 @@ , items: 8 , menu: '<ul class="typeahead dropdown-menu"></ul>' , item: '<li><a href="#"></a></li>' + , matcher: function (item) { + return ~item.indexOf(this.query) + } + , sorter: function (items) { + return items + } } $.fn.typeahead.Constructor = Typeahead |