Not Receiving Data Back From Geonames For an API Request to Render a HTML Response

Question

I have updated the below code and also added my username into the geonames request upon further research but still no joy.

Could be the value i'm trying to pass from the HTML so i'm including that also now.

          <td>1. Find Nearest Ocean</td>
          <td>
            <select id="latitudeOne">
              <option>40.78343</option>
              <option>133.7751</option>
              <option>106.3468</option>
            </select>

            <select id="longitudeOne">
              <option>-43.96625</option>
              <option>25.2744</option>
              <option>56.1304</option>
            </select>
          </td>
          <td><button id="btnRunOne">Run</button></td>
        </tr>

The issue seems to be between the ajax request & getting a data request back from the geonames API

$('#btnRunOne').click(function() {
$.ajax({
    url: "php/ocean.php",
    type: 'POST',
    dataType: 'json',
    data: {
            lat: $('#latitudeOne').val(),
            lng: $('#longitudeOne').val()
    },
    success: function(result) {

        console.log(JSON.stringify(result));

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

            $('#txtDistance').html(result['data'][0]['distance']);
            $('#txtGeonameID').html(result['data'][0]['geonameid']);
            $('#txtName').html(result['data'][0]['name']);
        }
        
    },
    error: function(jqXHR, textStatus, errorThrown) {
            // your error code
    }
});

and the php which I need to send the data back. I get the following error

Warning: Undefined array key "geonames" in C:\xampp\htdocs\geonamesExample\libs\php\getCountryInfo.php on line 27

Which is $output['data'] = $decode['geonames'];

<?php

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

    $executionStartTime = microtime(true);

    $url='http://api.geonames.org/oceanJSON?lat=' . $_REQUEST['lat'] . '&lng=' . $_REQUEST['lng'] . '&username=simonjadams';

    $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);

    $decode = json_decode($result,true);    

    $output['status']['code'] = "200";
    $output['status']['name'] = "ok";
    $output['status']['description'] = "success";
    $output['status']['returnedIn'] = intval((microtime(true) - $executionStartTime) * 1000) . " ms";
    $output['data'] = $decode['geonames'];
    
    header('Content-Type: application/json; charset=UTF-8');

    echo json_encode($output); 

?>

Is there something really obvious that I am missing?

This is the GeoNames service I am trying to get the info from:

Ocean / reverse geocoding The name of the ocean or sea. Webservice Type : REST Url : api.geonames.org/ocean? Parameters : lat,lng, radius (optional) Result : returns the ocean or sea for the given latitude/longitude The oceans returned by the service are listed here. Example http://api.geonames.org/ocean?lat=40.78343&lng=-43.96625&username=demo

This service is also available in JSON format : api.geonames.org/oceanJSON?lat=40.78343&lng=-43.96625&username=demo

Answer 1

The response I see from the API has no geonames field, the root field is ocean.

{"ocean":{"distance":"0","geonameId":3411923,"name":"North Atlantic Ocean"}}

So you set the data to the ocean field

$output['data'] = $decode['ocean'];

This field is a single object(not an array of objects) so remove the array index in the js.

$('#txtDistance').html(result['data']['distance']);
$('#txtGeonameID').html(result['data']['geonameid']);
$('#txtName').html(result['data']['name']);