Bootstrap Typeahead Escaping?

So I’m using the Bootstrap typeahead plugin to display a list of classes. It works fine for most courses, but if you click the dropdown for Driver’s Education, the text displays in the input field as “Driver's Education”.

Is there some way to fix this?

  • Bootstrap Typeahead with AJAX source: not returning array as expected
  • How do I submit data populated from typeahead bloodhound auto complete
  • Free text input with autocomplete on special symbols
  • typeahead.js: Return all Bloodhound records on empty query
  • AngularJS typeahead search results in a div
  • Twitter Type Ahead Highlight Selection
  • How do I submit data populated from typeahead bloodhound auto complete
  • AngularJS typeahead add custom sort by function
  • using angular.js ui and bootstrap typeahead for asynchronous call to retrieve auto suggestions for search
  • Free text input with autocomplete on special symbols
  • Typeahead shows results as undefined
  • Angular UI typeahead drop down does not appear
  • One Solution collect form web for “Bootstrap Typeahead Escaping?”

    It is because you define your source array as a data attribute, and therefore is interpreted with HTML-entities. To the opposit, when the options is defined in a javascript handler special chars as ' will show up normal when the list dropdowns and afterwards in the input field when you have clicked :

    HTML wthout data attributes :

    <input type="text" data-provide="typeahead" id="stackoverflow">
    

    jquery constructer instead :

    $("#stackoverflow").typeahead({
       "source" : ["Driver's Education", "Toys'r'us Education"] //and so on
       //(,) rest of options, if any
    });