0

I created a simple element which display data using ajax call when selected option is changed. Since there will be so many values in select so i decided to use Bootstrap TypeAhead. It loads json data from a controller/action using ajax call. and it work for list of string. How can i load next data on selected value? because there is no id with this data, or how can i handle ID of the value for typeahead.

tereško
  • 58,060
  • 25
  • 98
  • 150
sagheer
  • 1,195
  • 1
  • 12
  • 19
  • Not sure I completely understand your question. Are you trying to load the values or use the value selected? Check out this post - might help you: http://stackoverflow.com/a/9435405/1861459 – pherris Mar 05 '14 at 18:20
  • 1
    If you need to retrieve text along with ID, I would recommend you to use the select2 plugin and its infinite scroll feature. here's a [link](http://ivaynberg.github.io/select2/) for the plugin – Derek Mar 05 '14 at 18:30

1 Answers1

0

I believe you are expecting data-source='[{id:123,value:"JavaScript"},{id:124,value:"Java"},{id:125:"PHP"}]'

when user type Javascript, you should get id = 123

This is not possible in bootstrap typeahead plugin.

Bootstrap typeahead plugin will accept data-source as String array / function. Values in the array will be rendered as dropdown and the values will set in data-value attribute.

ex. data-source='["JavaScript","Java","PHP"]'

<ul class="typeahead dropdown-menu">
 <li data-value="JavaScript" class="active"><a href="#">JavaScript</a></li>
<li data-value="Java" class="active"><a href="#">Java</a></li>
<li data-value="PHP" class="active"><a href="#">PHP</a></li>
</ul>

You cannot set ID to the list.

Jagadesh K
  • 237
  • 1
  • 13