title: JQuery Autocomplete does not display array of countries
body: <p>I have a search box and an array of countries.</p>
  <p><a href="https://codepen.io/Teeke/pen/qBajXMw?editors=1111" rel="nofollow noreferrer">https://codepen.io/Teeke/pen/qBajXMw?editors=1111</a></p>
  <pre><code>&lt;input type=&quot;text&quot; id=&quot;autocomplete&quot; name=&quot;country&quot; v-model=&quot;search&quot; class=&quot;form-control input-form&quot; placeholder=&quot;Search Earth...&quot;&gt;
  
  var countries = {
  &quot;A2&quot;: &quot;Andorra Test&quot;,
  &quot;AE&quot;: &quot;United Arab Emirates&quot;,
  &quot;AF&quot;: &quot;Afghanistan&quot;,
  &quot;AG&quot;: &quot;Antigua and Barbuda&quot;,
  &quot;AI&quot;: &quot;Anguilla&quot; 
  }
  var countriesString = [
  &quot;Andorra&quot;,
  &quot;Andorra Test&quot;,
  &quot;Just another country&quot;,
  &quot;United Arab Emirates&quot;
  ];
  var countriesArray = $.map(countries, function (value, key) { return { value: value, data: key }; });
  
  // Initialize ajax autocomplete:
  $('#autocomplete').autocomplete({
  // serviceUrl: '/autosuggest/service/url',
  //lookup: countriesString,
  lookup: countriesArray,
  lookupFilter: function(suggestion, originalQuery, queryLowerCase) {
      var re = new RegExp('\\b' + $.Autocomplete.utils.escapeRegExChars(queryLowerCase), 'gi');
      return re.test(suggestion.value);
  },
  onSelect: function(suggestion) {
      $('#selction-ajax').html('You selected: ' + suggestion.value + ', ' + suggestion.data);
  },
  onHint: function (hint) {
      $('#autocomplete-ajax-x').val(hint);
  },
  onInvalidateSelection: function() {
      $('#selction-ajax').html('You selected: none');
  }
  });
  </code></pre>
  <p>I loaded in the dependency libraries, JQuery and JQuery Autocomplete. The array of countries is not displaying properly.</p>