Autocomplete Json

Cześć,
mam skrypt Easyautocomplete (autosugestia)
http://easyautocomplete.com/

sugestie pobieram z pliku Json a sam kod do pobrania wygląda tak.

<script type="text/javascript">

 
var options = {
	
  url: "js/countries.json",

  getValue: "name",

  list: {
    match: {
      enabled: true
    },
    maxNumberOfElements: 8
  },

  template: {
    type: "custom",
    method: function(value, item) {
      return "<span class='flag flag-" + (item.code).toLowerCase() + "' ></span>" + value;

    }
  },
  
};

$("#countries-flags").easyAutocomplete(options);

Chciałbym aby ""js/countries.json"" wstawić tam zmienną która będzie się zmieniać wraz ze zmianą radio.
Dajmy na to mamy inputy name"country" value="PL"/value="DE" itd.

Cały skrypt ma pobierać dane z różnych Jsonów w zależności od wybranego inputa najlepiej AJAXem bez przeładowania strony.

Jak się za to zabrać?

Po pierwsze, zapisz sobie "szablon" opcji tego pluginu w jakimś miejscu

window.autocompleteOptions = {
    getValue: "name",
    url: "countries-de.json",
    list: {
        match: {
            enabled: true
        },
        maxNumberOfElements: 8
    },
    template: {
        type: "custom",
        method: function (value, item) {
            return "<span class='flag flag-" + (item.code).toLowerCase() + "' ></span>" + value;
        }
    },
};

Po drugie, dodaj obsługę zdarzenia change radio inputa np.

$(function () {
    $("#german-radio-button").on("change", updateAutocomplete);
    $("#polish-radio-button").on("change", updateAutocomplete);
});

I po trzecie, w obsłudze zdarzenia podmieniaj url w opcjach skryptu i wołaj go ponownie:

function updateAutocomplete(event) {
    window.autocompleteOptions.url = `countries-${event.target.value}.json`;
    $("#countries-flags").easyAutocomplete(window.autocompleteOptions);
}

W Twoim przypadku potrzebne będą skrypty countries-PL.json i countries-DE.json, pole value radio inputa steruje 'sufiksem' nazwy pliku, z którego ładowane są dane.

Wow! działa :)

Jeszcze musiałbym zrobić tak aby po przeładowaniu strony skrypt ładował ostatnie radio. Czyli pole checked :)

dzięki z góry za pomoc!!

var radios = document.getElementsByName('country');

for (var i = 0, length = radios.length; i < length; i++) {
  if (radios[i].checked) {
    break;
  }
}

Temat do zamkniecia :)