Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Conveniently use objects in Typeahead #7298

Closed
wants to merge 14 commits into from
Closed

Conversation

pickypg
Copy link
Contributor

@pickypg pickypg commented Mar 16, 2013

http://jsfiddle.net/Mtxkn/15/

This adds the ability to conveniently override a lot more methods (ones that I arbitrarily identified as reasonable through my own usage), as well as providing an updated sorter method for interaction with objects. Further, by exposing each internal sorting step as a method, as well as the query values, each piece can be overridden to enable Typeahead to work with arbitrary data. With the changes, default behavior should remain unchanged.

The extra sorting option, sortAny, is added to support the case where the source gives results that may not match the actual query at all, such as through Ajax results that may have typo correction. Such cases must also override matcher:

matcher: function() {
  return true
}

That can be done without changes, but the sorting would have to be completely overridden in its current form even for simple, arbitrary object sorting. Allowing each step to be overridden enables arbitrary object support for both the item and the query due to the one-time expense of looking up the query in both normal and lowercase form; those methods could return anything relevant to the actual task at hand rather than a single string as well.

Overriding highlighter will always be necessary to support JSON objects, but that is already exposed.

Also attached are a few unit tests to test the minor added functions.

Finally, this is my first attempt at a multi-file pull request, and it's bringing across a CSS change that I referenced in a different pull request (dropdowns.less). I don't know how to remove that as part of the current request, so I apologize for the clutter.

Use translucent box shadow on hr elements; colorize hr elements within a...
I have recently been experimenting with a lot of Typeahead controls, and I ran into a situation where my Typeahead was too wide for my screen, particularly on mobile devices, and it was not wrapping as I had expected it to do.

http://jsfiddle.net/Mtxkn/4/

Changing the CSS for .dropdown-menu > li > a to white-space: normal causes it to wrap in every scenario that I have seen, whereas leaving it as nowrap never does what I want when the text is too long for a given item.

It's possible that this has ramifications for other dropdown menus, but honestly I expect that even those would prefer to wrap than to extend the screen horizontally.  If that is not the case, then it would work to change the typeahead version of this only:

```css
.typeahead > li > a {
  white-space: normal;
}
```
http://jsfiddle.net/Mtxkn/11/

This adds the ability to conveniently override a lot more methods (ones that I arbitrarily identified as reasonable through my own usage), as well as providing an updated `sorter` method to interaction with objects.  Further, by exposing each internal sorting step as a method, as well as the query values, each piece can be overridden to enable Typeahead to work with arbitrary data.

The extra sorting option, `sortAny`, is added to support the case where the source gives results that may not match the actual query at all, such as through Ajax results that may have typo correction.  Such cases would want to at least override `matcher`:

```javascript
matcher: function() {
  return true
}
```

That can be done without changes, but the sorting would have to be completely overridden in its current form even for simple, arbitrary object sorting.  Allowing each step to be overridden enables arbitrary object support for both the `item` and the query due to the one-time expense of looking up the query in both normal and lowercase form; those methods could return anything relevant to the actual task at hand rather than a single string as well.

Overriding `highlighter` will always be necessary to support JSON objects, but that is already exposed.
Verifying details of sorting work as intended
Just goes to show why unit testing is so good. Catches stupid mistakes
Glad I did the test. Next time I'll have to set up the unit test environment locally so there isn't so much pull request spam.
Enables simpler overriding of either just showing the menu (location) or changing behavior for `show` without effecting `showMenu`.
@cvrebert
Copy link
Collaborator

Related to #6836 (and its dupes).

If the position is out of range, then it would simply `return` unlike all other `return`s in the function.  This can at least break at line 201, as well as anyone overriding expecting a return.

This change causes it to return `this` in all cases to avoid any unexpected exceptions.
@mdo
Copy link
Member

mdo commented May 9, 2013

Punting on this.

We've dropped bootstrap-typeahead.js in v3 (see 88dd9de) in favor of folks using Twitter's typeahead.

<3

@mdo mdo closed this May 9, 2013
@pickypg pickypg deleted the 3.0.0-wip branch May 17, 2013 02:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants