Geonames API showing empty array

Question

I am trying to complete a project that requires me to use Geonames API to show information about any country a user types in on my webpage search box. The API in the console is just showing as empty and I can't work out why.

$('#btnRun').click(function() {

    $.ajax({
        url: "libs/countryInfo.php",
        type: 'GET',
        dataType: 'json',
        data: {
            country: $('#country').val(),
        },

        success: function(result) {
            
            
            console.log(result);

            if (result && result.status && result.status.name === "ok") {

                $('#txtCapital').html(result.data.capital);
                $('#txtPopulation').html(result.data.population);
                $('#txtCurrency').html(result.data.currency);
                $('#txtLanguage').html(result.data.language);
                $('#txtCoordinates').html(result.data.coordinates);
                
                $('#countryInfoResults').show();
            } else {
                // Handle other cases, e.g., display an error message
                console.error("Error:", result.status.description);
                
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            console.error("AJAX Error:", textStatus, errorThrown);
        }
    });
});

PHP

<?php

    ini_set('display_errors', 'On');
    error_reporting(E_ALL);

    header("Access-Control-Allow-Origin: *");
    header("Content-Type: application/json");
    
    $executionStartTime = microtime(true);

    $url = 'http://api.geonames.org/countryInfoJSON?formatted=true&country=' . $_REQUEST['country'] . '&username=susan.alexander&style=full';
    
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_URL, $url);

    $result = curl_exec($ch);

    curl_close($ch);

        // Checks if 'country' parameters is provided
        if (!isset($_REQUEST['country'])) {
            // Handle the case where any of the parameters are missing
            $output['status']['code'] = "400";
            $output['status']['name'] = "Bad Request";
            $output['status']['description'] = "Country parameter is missing";
            $output['status']['returnedIn'] = intval((microtime(true) - $executionStartTime) * 1000) . " ms";
            $output['data'] = $decode['country'];
            echo json_encode($output);
            exit();
        }
    
    echo $result;

I've tried many things to get it to work that I've read on here similar issues and resolutions that I have tried. And I've searched the web, but nothing is working. I think it's to do with the way I am calling for the information in my JavaScript file but I could be totally wrong.

Answer 1

It's advisable to send the country's short code from the select field.

      <select name="country" id="country">
<option value="us">usa</option>
<option value="NP">Nepal</option>
<option value="pa">Panama</option>
    </select>
    <button id="btnRun">search Country</button>

<script>
    
$('#btnRun').click(function() {

$.ajax({
    url: "countryInfo.php",
    type: 'GET',
    dataType: 'json',
    data: {
        country: $('#country').val(),
    },

    success: function(result) {
        
        
        console.log(result);

        if (result && result.status && result.status.name === "ok") {

            $('#txtCapital').html(result.data.capital);
            $('#txtPopulation').html(result.data.population);
            $('#txtCurrency').html(result.data.currency);
            $('#txtLanguage').html(result.data.language);
            $('#txtCoordinates').html(result.data.coordinates);
            
            $('#countryInfoResults').show();
        } else {
            // Handle other cases, e.g., display an error message
            console.error("Error:", result.status.description);
            
        }
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.error("AJAX Error:", textStatus, errorThrown);
    }
});
});
</script>

here is sample output 1