0

I'm trying to show currency exchange rates data of each country on popup in leaflet.js I'm using the following code.

function makePopupContent(country) {
    $.ajax({
        url: "php/opencage.php",
        type: 'POST',
        dataType: 'json',
        data: {
            code: country.properties.currency    
        },
        
        success: function(result) {
            currencydata=result['data'];
            console.log(currencydata);
            $('#exchange').html(currencydata); 
       },
        //if there is no success in retrieving data from api
        error: function(jqXHR, textStatus, errorThrown) {
            console.log("error")
        }
    }); 

    return `
    <div>
        <h4>${country.properties.country}</h4>
        <p>Capital:${country.properties.city}</p>
        <p>Currency:${country.properties.currency}</p>
        <p id="exchange"></p>
        
        
    
    </div>
  `
  
}

I'm getting the data from api correctly but how should I display it in each pop for each country?

  • You are using AJAX to make the request ( where the `A` stands for `asynchronous` ) so that function has a `return` statement that is set possibly/probably **before** the AJAX request has done it's thing. Any DOM manipulation that you need to do ( ie: display things, modify things ) should be done within the `success` callback - there is no meaningful `return` value from the above. – Professor Abronsius Sep 11 '22 at 21:53

0 Answers0