devbridge / jQuery-Autocomplete

Ajax Autocomplete for jQuery allows you to easily create autocomplete/autosuggest boxes for text input fields
https://www.devbridge.com/sourcery/components/jquery-autocomplete/
Other
3.56k stars 1.66k forks source link

Ajax call without paramName #571

Closed Kosmonaft closed 7 years ago

Kosmonaft commented 7 years ago

Is it possible to call an API without paramName? The reason I'm asking is because the API end point which I'm trying hit is restcountries And query should look like this: https://restcountries.eu/rest/v1/name/xxx xxx- string

I tried in this way but the url is following: https://restcountries.eu/rest/v1/name/?null=ger

$('#search').autocomplete({ paramName:null, serviceUrl: 'https://restcountries.eu/rest/v1/name/', onSelect: function (suggestion) { alert('You selected: ' + suggestion.value + ', ' + suggestion.data); } });

Shnoulle commented 7 years ago

Here, the ajaxClass need name for parameters

Quick hack

$('#search').autocomplete({
  paramName:'name',
  serviceUrl: 'https://restcountries.eu/rest/v1',
  ajaxSettings:{
  beforeSend : function(jqXHR, settings) {
          settings.url=settings.url.replace("=","/").replace("?","/")
      }
  }
});

But you need to update response too : see https://www.devbridge.com/sourcery/components/jquery-autocomplete/#jquery-autocomplete-non-standard-queryresults

Kosmonaft commented 7 years ago

@Shnoulle Thank you. I didn't saw beforeSend.

Here is the whole solution if someone is going to need it:

$('#search').autocomplete({
    paramName: 'name',
    serviceUrl: 'https://restcountries.eu/rest/v1',
    minChars: 2,
    ajaxSettings: {
        beforeSend: function (jqXHR, settings) {
            settings.url = settings.url.replace("=", "/").replace("?", "/");
        }
    },
    transformResult: function (response) {
        return {
            suggestions: $.map($.parseJSON(response), function (item) {
                return {
                    value: item.name,
                    data: item
                };
            })
        };
    }
});