Просмотр листовки по ajax (название города или postalCode)

Question

Мы пытаемся перейти на Leaflet из gmaps. Настройка карты работала нормально, маркеры для всех наших магазинов тоже работают. Я использовал поиск по листовке для этого встроенного решения для поиска городов.

Но он работает с keyPress или чем-то подобным.

Мы хотим иметь вход с отдельной кнопкой дляsubmit.

Ранее мы просто использовали ajax с определенным URL-адресом из gmaps и добавили значение поиска. Но с Leaflet я просто не могу это сделать ... Это выглядело так:

function geocode(key)
{
var address = key.replace(/ /g, '+');
var url = 'https://maps.googleapis.com/maps/api/geocode/json';
url += "?key=" + SitePreferences.GOOGLE_MAP_API_KEY;

$.ajax({
    url     : url,
    data    : {address:address},
    dataType: "json",
    success : function (json)
    {
        setGeocode(json);
    },
    error: function()
    {
        console.log("Google map API geocode error");
    }
});}

Как мне сделать это с листовкой? Я пытался вот так без успеха:

var url = 'https://nominatim.openstreetmap.org/search?format=json&q={address}';

        $.ajax(
        {
             url:url, 
             dataType: "json",
             success: function(data)
             {
                 console.log(data),
             }
        });

Answer 1

Ваш код был в порядке, в нем была синтаксическая ошибка, я также отправлял параметры, используя данные, а не напрямую из URL

$('#find').click(function(){
  var url = 'https://nominatim.openstreetmap.org/search';
  $.ajax(
  {
    url: url, 
    dataType: "json",
    data:{
      format:'json',
      q: '{' + $("#address").val() + '}'
    },
    success: function(data)
    {
       console.log(data);
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="address" />
<button id="find">find address</button>