[typeahead.js] data-* attributes

[krisrybak]

Since typeahead imitates behaviour of dropdown (selecting item from the list) it is very likely that users would like to pass a some sort of value when item is selected (this would normally be some sort of id). At the moment typeahead renders a list and the only value you can access without hacking is the .text of

element:

var stateList = ["California", "Arizona", "Nevada"];
//..
<ul>
   <li data-value="California">
       <a href="#">California</a>
   </li>
</ul>

It would be a nice addition if we were able to pass some sort of id. In fact as many as you may require:

var stateList = [
    {"stateCode": "CA", "value": "California", "data_attr":{"id":"1", "state-code":"CA"}},
    {"stateCode": "AZ", "value": "Arizona", "data_attr":{"id":"2", "state-code":"AZ"}},
    {"stateCode": "NV", "value": "Nevada", "data_attr":{"id":"3", "state-code":"NV"}}
   ...
]
//..
<ul>
   <li data-value="California" data-id="1" data-state-code="CA">
       <a href="#">California</a>
   </li>
</ul>

[cvrebert]

Moot due to #7805.

[cvrebert]

You may want to try Select2.